«🛠️ Զրոյական ծախսերի կույտ.

#🛠️ Զրոյական ծախսերի կույտ՝ Next.js, Vercel և GitHub

Այս trifecta-ն հզոր համադրություն է նվազագույնից զրոյական գնով պրոֆեսիոնալ վեբ ներկայություն ստեղծելու և տեղակայելու համար: Այն օգտագործում է համաշխարհային կարգի տեխնոլոգիա՝ ապահովելու ձեր կայքը արագ, անվտանգ և հեշտ սպասարկվող:

| Բաղադրիչ | Դերը | Արժեքը | Ինչու է դա լավագույն ընտրությունը | | :--- | :--- | :--- | :--- | | Next.js | Շրջանակը (Կոդը) | **Անվճար ** (Բաց կոդով) | Բարձր կատարողականություն, գերազանց SEO և հեշտ պատկերի օպտիմալացում: Պահպանվում է Vercel-ի կողմից։ | | Vercel | Հոսթ (սերվեր) | Անվճար (Հոբբի պլան) | Զրոյական կոնֆիգուրացիայի տեղակայում Next.js-ի համար, գլոբալ CDN արագության համար և ավտոմատ SSL: | | GitHub | Աղբյուրը (պահեստը) | **Անվճար ** (Հանրային/մասնավոր ռեպո) | Ապահովորեն պահում է ձեր կոդը և յուրաքանչյուր փոփոխության դեպքում ավտոմատ կերպով գործարկում է Vercel-ի տեղակայումը: |

#🚀 Քայլ 1. Ստեղծեք ձեր նախագիծը GitHub-ում (անվճար)

Ձեր կայքի կոդը տուն է պետք, և դա GitHub-ն է: Այս հարթակը ապահով կերպով պահում է ձեր կոդը և կառավարում ձեր նախագծի տարբերակների պատմությունը:

• Ստեղծեք GitHub հաշիվ. Եթե չունեք, գրանցվեք:
• Սկսեք ձեր նախագիծը. Դուք ունեք երկու հիմնական տարբերակ.
  • ** Տարբերակ Ա (Խորհուրդ է տրվում նկարիչներին). Օգտագործեք ձևանմուշ։** Որոնեք «Next.js պորտֆոլիոյի ձևանմուշ GitHub» (կամ «Vercel կաղապար»): Շատ տաղանդավոր ծրագրավորողներ առաջարկում են գեղեցիկ, անվճար կոդերի բազաներ: Պարզապես «Fork» կամ «Օգտագործեք այս ձևանմուշը»՝ ձեր սեփական պահոցում պատճեն ստեղծելու համար: Սա ձեզ խնայում է կոդավորման շաբաթներ:
  • Տարբերակ B (Մշակողների համար). Սկսեք զրոյից: Գործարկեք «npx create-next-app@latest»-ը տեղում և հետևեք հրահանգներին: Այնուհետև ձեր տեղական կոդը մղեք նոր, դատարկ GitHub պահոց:
• Տեղական կլոնավորում. Օգտագործեք ձեր նախընտրած մեթոդը (VS Code, Git CLI)՝ պահեստը ձեր համակարգչում ներբեռնելու համար:

Հաջորդ քայլը. Ձեր կոդը այժմ ապահով կերպով պահված է և վերահսկվում է տարբերակով:

#💻 Քայլ 2. Կառուցել և անհատականացնել Next.js-ի միջոցով (անվճար)

Սա այն վայրն է, որտեղ դուք կյանքի եք կոչում ձեր պորտֆելը: Next.js-ը React շրջանակ է, որը հեշտացնում է արագ և ժամանակակից կայքերի կառուցումը:

#Անհատականացրեք բովանդակությունը.

Բացեք նախագիծը ձեր կոդի խմբագրիչում: Դուք հիմնականում խմբագրելու եք ֆայլեր՝

• Ավելացրեք ձեր սեփական տեքստը «Մի մասին» էջում (/pages/about.js կամ «/app/about/page.js`):
• Փոխարինեք տեղապահի պատկերները ձեր արվեստի գործերով (հաճախ «/public» պանակում):
• Կարգավորեք նավիգացիոն հղումները:

#Ավելացնել ձեր արվեստի գործը (Բանալին).

1. Կազմակերպեք ձեր լավագույն կտորները թղթապանակների մեջ:
2. Օգտագործեք Next.js «<Image />» բաղադրիչը: Սա կարևոր է: Այն ավտոմատ կերպով օպտիմիզացնում է ձեր մեծ գեղարվեստական ​​ֆայլերը, դրանք չափափոխում և դրանք մատուցում ժամանակակից ձևաչափերով (ինչպես WebP), այնպես որ ձեր կայքը կայծակնային արագ բեռնում է ցանկացած սարքի վրա:

#Տարբերակի վերահսկում.

• Կատարեք ձեր փոփոխությունները. Ձեր հարմարեցումները կատարելուց հետո կատարեք փոփոխությունները իմաստալից հաղորդագրությամբ (օրինակ՝ «git commit -m «Ավելացրել եմ իմ առաջին հինգ արվեստի գործերը»):
• Push to GitHub. Վերբեռնեք ձեր փոփոխությունները ձեր GitHub պահոցում («git push origin main»):

Հաջորդ քայլը. Ձեր վերջնական կոդը պատրաստ է տեղակայման:

#☁️ Քայլ 3. Գործարկել Vercel-ի հետ (անվճար հոստինգ)

Vercel-ը Next.js-ի ստեղծողն է, ուստի դրանց հոսթինգը հիանալի օպտիմիզացված է: Նրանց Հոբբի պլանը անվճար է ընդմիշտ և ներառում է այն ամենը, ինչ անհրաժեշտ է պորտֆելին:

1. Գրանցվեք Vercel-ում: Գնացեք Vercel և գրանցվեք՝ օգտագործելով ձեր GitHub հաշիվը: Սա անվճար, ավտոմատացված կապի բանալին է:
2. Ներմուծեք ձեր նախագիծը.
   • Vercel-ի վահանակում սեղմեք «Ավելացնել նոր» > «Նախագիծ»:
   • Ցանկից ընտրեք ձեր GitHub պահոցը:
   • Vercel-ը ավտոմատ կերպով կհայտնաբերի, որ դա Next.js նախագիծ է: Սովորաբար կարող եք պարզապես սեղմել «Deploy»:
3. Ձեր անվճար URL-ը Live է: Vercel-ն անմիջապես տեղակայում է ձեր կայքը անվճար URL-ի վրա (օրինակ՝ «my-artist-site.vercel.app»):
4. Ավտոմատիկ թարմացումներ. Այսուհետ, ամեն անգամ, երբ դուք նոր կոդ մտցնեք GitHub-ի ձեր հիմնական մասնաճյուղ, Vercel-ը ավտոմատ կերպով կվերակառուցի և կտեղակայի ձեր կայքը րոպեների ընթացքում: Սա շարունակական տեղակայման կախարդանքն է (CI/CD):

Հաջորդ քայլը. Ձեր պորտֆոլիոն այժմ հասանելի է ինտերնետում, 100% անվճար:

---## 🌐 Քայլ 4. Գնեք և միացրեք ձեր անհատական տիրույթը (միակ արժեքը)

Վերջնական քայլը միացնելն է ձեր պրոֆեսիոնալ տիրույթի անունը, օրինակ՝ «https://www.yourname.com»: Սա միակ մասն է, որն արժե գումար (սովորաբար տարեկան 10–20 դոլար):

1. Գնեք ձեր տիրույթը. Գնեք ձեր տիրույթի անունը ցանկացած գրանցողից (Namecheap, GoDaddy, Google Domains կամ նույնիսկ ուղղակիորեն Vercel-ի միջոցով):
2. Միացեք Vercel-ում:
   • Ձեր Vercel նախագծի կարգավորումներում նավարկեք դեպի «Դոմեններ»:
   • Մուտքագրեք ձեր գնված տիրույթի անունը:
   • Vercel-ը ձեզ կտրամադրի մի պարզ հրահանգներ (սովորաբար A գրառում կամ CNAME գրառում)՝ ավելացնելու ձեր տիրույթի գրանցողի DNS կարգավորումներին:
3. Սպասեք և հաստատեք. Ձեր DNS կարգավորումները թարմացնելուց հետո Vercel-ը կստուգի տիրույթի կապը, հաճախ մեկ ժամից պակաս ժամանակում:

#🎉 Շնորհավորում ենք։

Ձեր պրոֆեսիոնալ նկարիչների պորտֆոլիոն այժմ գործում է ձեր հատուկ տիրույթում, որն աշխատում է համաշխարհային կարգի ենթակառուցվածքով նվազագույն ծախսերով: Դուք լիովին վերահսկում եք կոդը, ավտոմատ թարմացումները և կայծակնային արագ կայք՝ ձեր աշխատանքը ցուցադրելու համար, այս ամենը միայն ձեր տիրույթի գնով: