Как настроить проект 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.