Поиск по сайту:

Как настроить проект Next.js в Ubuntu


Next.js — это известная платформа для React, которая помогает создавать быстрые и современные веб-сайты, которые просты в использовании и имеют мощные функции, такие как рендеринг на стороне сервера, создание статические страницы и создание API.

Если вы хотите запустить проект Next.js в своих системах на базе Ubuntu, это руководство шаг за шагом проведет вас через этот процесс.

Предварительные условия

Прежде чем приступить к настройке проекта Next.js, вам необходимо установить в вашей системе Linux несколько вещей, в том числе:

  • Node.js: Next.js построен на основе Node.js, поэтому вам понадобится Node.js установлен.
  • npm: npm (Менеджер пакетов узлов) используется для управления пакетами и зависимостями вашего проекта.

Давайте пройдемся по процессу установки как для Node.js, так и для npm.

Шаг 1 1. Установите Node.js и NPM в Linux

Перед установкой любого нового программного обеспечения рекомендуется обновить список пакетов, чтобы убедиться, что вы устанавливаете последнюю версию программного обеспечения, доступную в репозиториях.

sudo apt update

Далее вы можете установить Node.js (также устанавливается npm). Лучше всего установить версию Node.js, помеченную как LTS (Долгосрочная поддержка), поскольку это наиболее стабильная и широко используемая версия.

sudo apt install nodejs

После завершения установки убедитесь, что Node.js установлен правильно, проверив его версию:

node -v
npm -v

Теперь в вашей системе установлены Node.js и npm.

Шаг 2. Установите и настройте проект Next.js

Теперь, когда у вас установлены Node.js и npm, пришло время создать новый проект Next.js. Самый простой способ установить Next.js — использовать create-next-app, официальный пакет, предоставленный командой Next.js. .

sudo npm install -g create-next-app

Теперь, когда create-next-app установлен, вы можете создать новый проект Next.js.

npx create-next-app@latest my-next-app

Здесь my-next-app — это имя папки вашего проекта. Вы можете заменить его на любое имя, которое вам больше нравится. Команда npx загрузит и запустит пакет create-next-app и настроит для вас новый проект Next.js.

После завершения выполнения команды у вас появится новая папка под названием my-next-app с базовой структурой приложения Next.js.

Шаг 3. Запустите проект Next.js

После создания проекта зайдите в папку вашего проекта и запустите сервер разработки:

cd my-next-app
npm run dev

Эта команда запустит сервер разработки Next.js. По умолчанию сервер будет работать по адресу http://localhost:3000.

Откройте браузер и перейдите по этому URL-адресу, и вы увидите страницу приветствия Next.js по умолчанию.

Вы можете начать создавать новые страницы в папке app. Например, создайте новый файл about.js внутри каталога app, чтобы создать страницу «О программе».

Заключение

Вы успешно настроили новый проект Next.js на своем компьютере с Ubuntu! Теперь вы можете начать создавать свое веб-приложение, добавляя новые страницы, компоненты и функции.

Next.js упрощает создание современных веб-приложений. С помощью этого руководства вы узнали, как установить и настроить проект Next.js.