CodePen-tip og bedste praksis

Når du arbejder i FCC vil der være tidspunkter, hvor du opretter dine egne projekter med CodePen. Campister kan lide at dele disse projekter på Free Code Camp Forum for at modtage feedback fra andre campister.

I dag vil jeg vise dig, hvordan du får mest muligt ud af CodePen, og hvordan du maksimerer din feedback inden for FCC Forum.

Hent din sovepose og marshmallows. Åh, og glem ikke at få din Yeti Cooler tilbage fra den bjørn, der stjal den, mens du sov! Vi går på vandretur for at lære et par ting.

Organisering af din kode i CodePen

Når jeg arbejder med CodePen for første gang, kan jeg huske, at jeg havde al min kode i HTML-afsnittet i min penn. Ligesom billedet herunder havde jeg mit HTML, CSS og indhold alt sammen på et sted.

Der er absolut intet galt i at opbygge din hjemmeside som denne. Men i CodePen er der måder til at rydde op i din kode for at gøre den mere organiseret og læsbar af andre, der hjælper dig eller blot tjekke dit fantastiske projekt.

Du kan åbne denne pen i en anden fane ved at klikke her. Dette giver dig mulighed for at lege med koden og følge med.

Lad os fjerne nogle ting

Vi har ikke brug for disse kodestykker, fordi CodePen automatisk indsprøjter dem i vores projekt.

Følg disse trin for at placere dit hovedindhold korrekt, hvor det skal gå i CodePen.

Lad os flytte vores meta-indhold og google font-links til Stuff For -delen af ​​CodePen.

Her er et snapshot af koden mellem head tags. Du skal kun flytte den kode, jeg har med fed skrift.


 
  Bootstrap Theme Company Page