How I Created My Portfolio Website (Frontend Web Developer) (Norsk)

0 Comments

alenanikulina.nyc

I recently graduated from Flatiron Coding Bootcamp in New York and entered the job market., Som en web-frontend-utvikler som leter etter en entry — level position jeg tror det er viktig å ha et profesjonelt nettsted som viser alle dine prosjekter, spesielt hvis du ikke har noen tidligere koding erfaring eller en formell CS grad. Inn i arbeidsmarkedet omgitt av coronavirus pandemi er skremmende å si det mildt, så jeg bestemte meg for å bruke denne tiden til å praktisere min ferdigheter, lære nye og forhåpentligvis bygge kule prosjekter underveis. Denne bloggen handler om mitt aller første prosjekt som jeg bygget i karantene som gikk live — min personlige portefølje nettstedet.,

Før du bygger nettstedet mitt jeg laget en plan for hvordan jeg kommer til å nærme seg den. Segmentene som jeg trengte til å arbeide på så ut som dette:

  • Planlegging — til å forstå hensikten, skissere leveransen
  • Design — skissere ideer, arbeider på farger og typografi
  • Utvikling — å skrive kode
  • – Publisering — hosting og få et tilpasset domenenavn

Planlegging

for å begynne Å bygge noe i livet er det nyttig å ha en plan eller idé om hva du ønsker å bygge, og hvordan du vil det skal se ut., Det er flott å starte med det formål i tankene, eller hvordan Simon Sinek vil si — «Start Med Hvorfor». I mitt tilfelle min hensikt var å bygge en personlig portefølje nettsted som ville ha alle mine opplysninger, vil alle prosjekter som jeg har laget i det siste, og min personlige bio. Dette nettstedet bør være ganske enkel, intuitiv, rask og representerer meg som en person så vel som en dyktig webutvikler. Det har å ha en ren og moderne design, og har en vakker brukergrensesnitt. Det bør være unike og kreative. Puh, det var mye!, Men jo mer konkret du får på alle detaljer, jo lettere vil det være å utføre. I oppsummerer leveransen jeg implementert bruker historier som dette:

— brukeren blir møtt med en hjemmeside (dette bør være noe kreativt og unikt, i mitt tilfelle brukte jeg tre.,pelling personlig historie samt opplysninger om utdanning, nåværende tech stabelen, tidligere arbeidserfaring og interesser/hobbyer — for en personlig touch)

— brukeren kan navigere til Prosjekter siden (dette er der hvor alle de beste prosjektene vil leve, med beskrivelser av teknologiene som er brukt og linker til Gitub og live video demoer)

— brukeren kan navigere til å ta Kontakt med Meg siden (denne side vil ha all nødvendig kontaktinformasjon samt linker til sosiale medier og Github)

Design

Etter å forstå hensikten og planlegger en grov skisse er det på tide å tenke på design!, Jeg er en veldig visuell person, så det var definitivt en av mine favoritt deler. Jeg startet med å tegne ut trådmodeller/tegninger for mine sider. Jeg rett og slett brukt penn og papir, men du kan bruke alle verktøyene du liker, for eksempel liker jeg også Figma som er en digital design og prototyping verktøy. Du kan bruke det til å lage nettsider, apps, eller mindre komponenter i brukergrensesnittet som kan integreres i andre prosjekter., Den første skisse av min trådmodeller så ut som dette:

Enkel wireframing hånd

Akkurat som blåkopi av en bygning, en trådramme beskriver detaljer tydelig og konkret, samtidig som det gir utbyggere (du, andre designere, utviklere, etc.) en oversikt over prosjektet. Etter skissene var ferdig begynte jeg å forske på fargevalg for nettstedet mitt., Jeg er ikke en designer, men jeg hadde en forståelse av at fargevalget bør være veldig moderne og rent. Jeg vil liste opp noen store ressurser som jeg fant for farge forskning på slutten av denne bloggen. Etter en betydelig mengde forskning jeg endte opp med å plukke svart som mitt primære fargen (hovedsakelig fordi hjemmesiden min hadde en 3D-grafikk av reiser gjennom verdensrommet) og neon rosa som min sekundære pop av farge.

Typografi spiller en viktig rolle i å sette tonen, temaet og budskapet av en nettside. For min hjemmeside jeg plukket Orbitron — en geometrisk sans-serif skrift er ment for visning formål., Det fungerte utmerket med min plass som tema, og det er minner om science fiction-filmene jeg pleide å se og kjærlighet som en gutt. Det andre valget for skrift falt til Raleway — det var en av de mest populære sammenkoblinger med Orbitron ifølge Google Skrifter. Dette er mitt Om side med et bilde av graffiti på en vegg som jeg tok på Flatiron skole i downtown Manhattan, som sier «Arbeide hardt, være hyggelig, få positive, holde sulten og har tro på at alt vil fungere ut — Flatiron-Skolen» — mitt mantra opp til denne dagen!,

– Utvikling

Nå er tiden for de mest spennende delen — å skrive koden! Det er mye debatt på nettet om hvordan du oppretter en tilpasset nettside vs bruke en mal, og det er absolutt fordeler og ulemper for begge disse alternativene., Så vidt jeg forstår er det greit å bruke en mal — det er raskere, enklere og minimal og hvis du er bare i starten av din karriere som en web-utvikler vil det definitivt være enklere for deg. Men, ikke misforstå, bør du tilpasse den og legge til funksjoner og funksjonalitet for å vise frem dine kunnskaper om programmering.

jeg personlig begynte med en Bootstrap malen, men endte opp med å lage alle mine sider fra bunnen av, fordi på den måten kunne jeg tilpasse det mer. Det definitivt tok måten lenger, men det var verdt det, og jeg er veldig fornøyd med hvordan det ble., Hovedmålet med dette portefølje nettstedet er å presentere prosjekter du har bygget, men selve nettsiden regnes også som et prosjekt selvfølgelig! Dette er min Prosjekter side med prosjekter som jeg bygget på Flatiron:

– Publisering

For å publisere din splitter nye nettside du vil ha til å bestemme om domenenavn og web hosting., Domenenavnet er adressen til ditt nettsted som folk skriver inn i nettleseren adressefeltet for å besøke nettstedet ditt. I henhold til min forskning er det viktig å ha et tilpasset domenenavn, fordi det øker troverdigheten og hjelper deg å bli funnet på nettet mer enkelt, men det er ikke obligatorisk. Jeg personlig har besluttet å gå med egendefinert domene som jeg har kjøpt fra namecheap.com.

Web hosting er stedet hvor alle filer på nettstedet ditt ligger. Det er som hjemmet til ditt nettsted der det faktisk bor., En god analogi ville være hvis domenenavnet er adressen til ditt hus, så web hosting er selve huset som adresse poeng til. Alle nettsteder på internett, må web hosting.

GitHub Sider er offentlige nettsider vert for gratis via GitHub, og det er ressurs-jeg brukte for hosting mine. GitHub-brukere kan opprette og vert både personlige nettsteder (en tillatt per bruker) og nettsteder som er relatert til spesifikke GitHub prosjekter så lenge de har kildekode på en offentlig depotet på GitHub., Etter min hjemmeside ble publisert, gjorde jeg et par endringer til det, og hver gang det ble distribuert med ingen problemer. Dette alternativet har fungert veldig bra for meg fordi det var gratis og enkelt å sette opp.

Siden jeg kjøpte domenet mitt fra et eget selskap og vert min hjemmeside for gratis med GitHub Pages det kreves en bit av oppsett. Etter at jeg peke domenet mitt til min web-hosting selskapet, ved å redigere DNS-innstillinger og venter på en dag min hjemmeside gikk live!, If you’re interested you can find it here https://alenanikulina.nyc


Legg igjen en kommentar

Din e-postadresse vil ikke bli publisert. Obligatoriske felt er merket med *