AstroJS bāzes projekta izveide

Šajā pamācībā uzzināsiet, kā izveidot savu pirmo projektu ar AstroJS. Mēs izmantosim npm create astro rīku, lai izveidotu servera lietojumprogrammu, kas var mijiedarboties ar OpenAI API. Jūs izpētīsiet ģenerētā projekta struktūru un gūsiet īsu pārskatu par to, kā to iedarbināt. Sāksim darbu uzreiz!

Galvenās atziņas

• Jauna projekta izveide AstroJS ir vienkārša, un to atbalsta interaktīvs vednis.
• Projekta izveide ietver atkarību (NPM moduļu) konfigurēšanu un projekta nosaukuma definēšanu.
• Integrētā AstroJS karstās ielādes funkcija ļauj redzēt izmaiņas reāllaikā bez nepieciešamības manuāli pārlādēt lapu.

Soli pa solim

Lai iestatītu AstroJS projektu, rīkojieties šādi:

Vispirms jāatver terminālis. Pārliecinieties, ka varat izpildīt komandas. Pirmais solis ir ievadīt komandu npm create astro. Ar šo komandu tiks palaists vednis, kas palīdzēs jums izveidot jaunu projektu.

Palaidot vedni, jums var tikt lūgts apstiprināt konkrētas npm pakotnes instalēšanu. Ja jums tas tiek prasīts, apstipriniet instalēšanu.

Pēc tam jums tiks lūgts norādīt jaunā projekta nosaukumu. Mūsu gadījumā es projektu nosauksim vienkārši par ai-chat. Ievadiet vēlamo nosaukumu un nospiediet enter.

Pēc tam vednis jautās, vai vēlaties instalēt parauga failus. Tā kā mums tas nav nepieciešams, izvēlieties n kā "nē" un turpiniet.

Nākamais solis ir instalēt nepieciešamās atkarības. Jums tiks jautāts, vai vēlaties instalēt attiecīgos npm moduļus tieši. Ieteicams atbildēt apstiprinoši, lai automatizētu instalēšanas procesu.

Kad atkarības ir instalētas, vednis jautā, vai vēlaties izmantot TypeScript. Ieteicams atteikties izmantot TypeScript, jo tas var palielināt sarežģītību. Jūs vienmēr varat pievienot TypeScript vēlāk, ja tas būs nepieciešams.

Vēl viens solis ir izlemt, vai vēlaties izmantot sākotnējo repozitoriju. Parasti sākumā tas nav nepieciešams, tāpēc arī šeit izvēlieties n kā "nē".

Tiklīdz būsiet atbildējuši uz visiem jautājumiem, no vedņa saņemsiet jauku noslēguma ziņojumu. Ar šo apstiprinājumu projekta pamatdaļa ir pabeigta.

Tagad apskatīsim izveidotā projekta struktūru. Pārslēdzieties uz projekta direktoriju ar cd ai-chat, lai izpētītu izveidoto struktūru.

Projekta struktūru var attēlot ar koku komandu. Tas sniedz pārskatu par to, kuri faili un mapes ir izveidoti.

Projekta direktorijā atrodami faktiskie Astro avota kodi sadaļā src. Šeit ir fails index.astro, kas darbojas kā sākuma lapa, un mēs to pēc brīža apskatīsim.

Lai jūsu Astro projekts darbotos lokāli, ir jāpalaiž skripts. Izmantojiet komandu npm run dev. Šī komanda iedarbinās izstrādes serveri, kas izvērsīs lietojumprogrammu.

Kad izstrādes serveris ir palaists, jums tiks parādīta adrese, parasti localhost:3000. Šo adresi varat atvērt tīmekļa pārlūkprogrammā, lai apskatītu lietojumprogrammu.

Varat kopēt adresi un ielīmēt to pārlūkprogrammā. Varat arī ar kontrolklikšķi (vai komandu klikšķi Mac operētājsistēmā) noklikšķināt uz adreses terminālī, lai to atvērtu tieši pārlūkprogrammā.

Ja viss ir iestatīts pareizi, jums vajadzētu redzēt Astro lapu, kurā redzams, ka serveris darbojas veiksmīgi.

Lai demonstrētu, cik viegli ir veikt izmaiņas, varat mainīt tekstu index.astro. Mainīsim tekstu uz ai chatbot un pārbaudīsim pārlūkprogrammā, vai izmaiņas ir redzamas.

Pēc izmaiņu saglabāšanas lapa pārlūkprogrammā automātiski atsvaidzināsies, un jums nebūs manuāli jāpārlādē lapa. Šī ir viena no lieliskajām AstroJS funkcijām!

Šī karstās ielādes funkcija ļauj redzēt izmaiņas reāllaikā, kas ievērojami paātrina izstrādes procesu.

Tagad jūsu pirmais Astro projekts ir gatavs darbībai, un jūs varat veikt turpmākus pielāgojumus vai to pilnveidot. Faili index.astro tiek pārvērsti HTML lapā un nogādāti pārlūkprogrammā. Tagad varat sākt izstrādāt un pievienot jaunas funkcijas.

Līdz nākamajai reizei, kad izpētīsim nākamos soļus šajā aizraujošajā projektā!

Kopsavilkums

Šajā pamācībā jūs uzzinājāt, kā izveidot jaunu AstroJS projektu, izmantojot npm create astro. Sākot ar atkarību instalēšanu un beidzot ar karstās ielādes izmantošanu, jūs esat izgājuši visus galvenos soļus, lai izveidotu un palaistu savu pirmo Astro vietni.