Konfiguracja projektu i CLI
Dowiedz się, jak zainicjować nowy projekt Next.js 15 i poruszać się po podstawowej strukturze projektu za pomocą interfejsu wiersza poleceń
Konfiguracja projektu i CLI to bezpłatna lekcja Next.js 15 Fullstack (App Router + Server Actions) na CoddyKit. To lekcja 1 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Next.js 15 Fullstack (App Router + Server Actions), a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Next.js 15 Fullstack (App Router + Server Actions) zawiera 4 lekcji w sumie.
Części tej lekcji nie zostały jeszcze przetłumaczone i są wyświetlane po angielsku.
Next.js 15: Your First Step
Welcome to Next.js 15 — the React framework for fast, scalable, production-ready apps. First up: spinning up a project and reading its structure from the CLI.
What You'll Need
Before you start, you need Node.js 18.17 or later — it provides the JavaScript runtime, and its package manager (npm, Yarn, or pnpm) installs your dependencies.
Initializing Your Project
Spin up a new project with create-next-app — it scaffolds everything for you. Just run this in your terminal.
npx create-next-app@latestSetup Prompts Explained
The CLI asks a few questions. The one that matters: say Yes to App Router — it's essential for Next.js 15. ESLint and Tailwind are nice; TypeScript is optional.
Navigating Your New Project
When it finishes you get a new project folder. Step into it with cd and you're ready to work.
cd my-next-appYour Project Structure
Know the key generated files: app/ holds your pages and layouts, public/ static assets, package.json your deps and scripts, next.config.js the config.
The Core `app` Directory
The app/ directory drives the App Router: layout.js for shared UI, page.js for a route's unique view, and globals.css for global styles.
Project Scripts & `npm run dev`
Your scripts live in package.json. The one you'll use constantly is npm run dev — it starts the development server.
npm run devHello Next.js!
With the dev server running, open localhost:3000 to see your app. That page is rendered by app/page.js — here's a stripped-down version.
export default function Home() {
return (
<main>
<h1>Hello CoddyKit!</h1>
</main>
);
}Quick Check: Setup Basics
You've learned how to kickstart a Next.js project. Let's test your knowledge!
Recap: Your First Next.js Steps
Recap: you set up Next.js 15 with create-next-app, explored the app/ directory, and launched the dev server. Next: file-system routing.
Często zadawane pytania
Czy lekcja „Konfiguracja projektu i CLI” jest bezpłatna?
Tak — pełny tekst „Konfiguracja projektu i CLI” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Next.js 15 Fullstack (App Router + Server Actions), przejdź na CoddyKit PRO. Kurs Next.js 15 Fullstack (App Router + Server Actions) zawiera 4 lekcji w sumie.
Co nauczysz się w „Konfiguracja projektu i CLI”?
Dowiedz się, jak zainicjować nowy projekt Next.js 15 i poruszać się po podstawowej strukturze projektu za pomocą interfejsu wiersza poleceń Ćwiczysz Next.js 15 Fullstack (App Router + Server Actions) z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć Next.js 15 Fullstack (App Router + Server Actions)?
Nie wymagamy żadnego doświadczenia. Next.js 15 Fullstack (App Router + Server Actions) w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 1 z 4.
Ile czasu zajmuje lekcja „Konfiguracja projektu i CLI”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji Next.js 15 Fullstack (App Router + Server Actions)?
Tak. Każda lekcja Next.js 15 Fullstack (App Router + Server Actions) zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.
Wszystkie lekcje w tym kursie
- Konfiguracja projektu i CLI
- Podstawy routingu opartego na systemie plików
- Przegląd stron i layoutów
- Stylowanie aplikacji Next.js