NĀKAMAIS JS BOILERPLATE: BOILERPLATE, KAS PAREDZĒTS NEXT.JS UN TAILWIND CSS.

Nākamais JS Boilerplate: Boilerplate, kas paredzēts Next.js un Tailwind CSS.

Katls un starteris Next JS 12+, Tailwind CSS 3 un TypeScript

Boilerplate un Starter for Next.js, Tailwind CSS un TypeScript ⚡️ Izgatavots, vispirms izmantojot izstrādātāja pieredzi: Next.js, TypeScript, ESLint, Prettier, Husky, Lint-Staged, VSCode, Netlify, PostCSS, Tailwind CSS.

Klonējiet šo projektu un izmantojiet to, lai izveidotu savu Next.js projektu. Varat pārbaudīt Next js veidņu demonstrāciju.

Iespējas

Vispirms izstrādātāja pieredze:

Next.js statiskajam vietņu ģeneratoram
Integrējiet ar Tailwind CSS
PostCSS Tailwind CSS apstrādei un integrēts |_+_|
Tipa pārbaude TypeScript
✅ Stingrs režīms TypeScript un React 17
✏️ Linter ar ESLint (noklusējuma NextJS, NextJS Core Web Vitals, Tailwind CSS un Airbnb konfigurācija)
Absolūtais imports
Koda formatētājs ar Prettier
🦊 Haskijs Git Hooks
Lint-inscendēts, lai palaistu līkumus Git inscenētajos failos
VSCode konfigurācija: atkļūdošana, iestatījumi, uzdevumi un paplašinājums PostCSS, ESLint, Prettier, TypeScript
🤖 SEO metadati, JSON-LD un Open Graph tagi ar nākamo SEO
⚙️ Bundler analizators
️ Viena klikšķa izvietošana, izmantojot Vercel vai Netlify (vai manuāla izvietošana jebkurā mitināšanas pakalpojumā)
Iekļaujiet BEZMAKSAS minimālisma tēmu
Maksimizējiet bākas punktu skaitu

Iebūvēta funkcija no Next.js:

pakalpojumu pēc pieprasījuma platforma

☕ Samaziniet HTML un CSS
Tiešraides pārlādēšana
✅ Kešatmiņas izjaukšana

Filozofija

Minimālais kods
SEO draudzīgs
Gatavs ražošanai

Nextless.js SaaS Boilerplate

Izveidojiet savu SaaS produktu ātrāk, izmantojot React SaaS Boilerplate.

Premium motīvi

Zaļā Nextjs galvenās lapas veidne	Violeta Saas Nextjs tēma

Atrodiet vairāk Nextjs motīvu.

Prasības

Node.js 14+ un npm

Darba sākšana

Palaidiet šo komandu vietējā vidē:

|_+_|

Pēc tam varat palaist lokāli izstrādes režīmā ar tiešraides atkārtotu ielādi:

|_+_|

Atveriet http://localhost:3000 ar savu iecienītāko pārlūkprogrammu, lai skatītu savu projektu.

ngx-bootstrap angular 9

|_+_|

Pielāgošana

Jūs varat viegli konfigurēt Next js Boilerplate. Lūdzu, mainiet šo failu:

|_+_|, |_+_|, |_+_| un |_+_|: jūsu vietnes favicon, kuru varat ģenerēt no https://favicon.io/favicon-converter/
|_+_|: jūsu CSS fails, izmantojot Tailwind CSS
|_+_|: konfigurācijas fails
|_+_|: noklusējuma motīvs

Izvietot ražošanā

Jūs varat redzēt rezultātus lokāli ražošanas režīmā, izmantojot:

|_+_|

Ģenerētie HTML un CSS faili tiek samazināti (iebūvēta funkcija no Next js). Tas arī noņems neizmantoto CSS no Tailwind CSS.

Varat izveidot optimizētu ražošanas būvējumu, izmantojot:

bitbucket pirms apņemšanās āķis

|_+_|

Tagad jūsu emuārs ir gatavs izvietošanai. Visi ģenerētie faili atrodas |_+_| mapi, kuru varat izvietot ar jebkuru hostinga pakalpojumu.

Izvietot Netlify

Klonējiet šo repozitoriju savā GitHub kontā un izvietojiet Netlify:

Izvietot uz Vercel

Izvietojiet šo Next JS Boilerplate Vercel ar vienu klikšķi:

VSC koda informācija (pēc izvēles)

Ja esat VSCode lietotājs, varat iegūt labāku integrāciju ar VSCode, instalējot ieteikto paplašinājumu |_+_|. Sākuma kodā ir iekļauti iestatījumi, kas nodrošina netraucētu integrāciju ar VSCode. Atkļūdošanas konfigurācija ir nodrošināta arī priekšgala un aizmugursistēmas atkļūdošanas pieredzei.

Profesionāļu padomi: ja jums ir nepieciešama visa projekta tipa pārbaude, izmantojot TypeScript, Mac datorā varat palaist būvējumu ar Cmd + Shift + B.

palielināt Google rīkjoslu

Iemaksas

Ikviens ir laipni aicināts piedalīties šajā projektā. Ja jums ir jautājumi vai esat atradis kļūdu, varat atklāt problēmu.

Autors: ixartz
Avota kods: https://github.com/ixartz/Next-js-Boilerplate
Licence: MIT licence

#tailwindcss #next #nextjs

Nākamais JS Boilerplate: Boilerplate, kas paredzēts Next.js un Tailwind CSS.