next-landing-lesson

Создание лендинга на NextJS

Этот урок разделен на 5 частей. Каждая часть содержится в своей ветке.

• В нулевой части содержится инструкция по инициализации проекта.
• В первой части объясняется, как лучше экспортировать асеты (изображения и шрифты).
• Во второй части рассматривается создание компонентов (кнопки, ссылки и другие повторяющиеся блоки), которые будут использоваться на странице.
• В третьей части мы наконец перейдем к верстке страницы.
• В четвертой части будет апгрейд верстки для просмотра для мобильных устройствах.

Погнали

Для начала форкнем (скопируем на свой аккаунт) репозиторий. Нажмите соответствующую кнопку в верхнем правом углу.

Затем уберите чекбокс чтобы форкнуть все ветки,

а после нажмите create fork

Вы прекрасны! Теперь склонируем репозиторий к себе на компьютер. Для этого нажмите кнопку код и скопируйте адрес репозитория.

Откройте на вашем компьютере папку для проектов, нажмите правой кнопкой мыши в пространстве папки и выберите опцию "Открыть окно PowerShell здесь"

Введите в PowerShell следующую команду

git clone вставьте_скопированный_адрес_сюда

При успешном клонировании вы увидите следующее сообщение

Cloning into 'next-landing-lesson'...
remote: Enumerating objects: 4, done.
remote: Counting objects: 100% (4/4), done.
remote: Compressing objects: 100% (4/4), done.
remote: Total 4 (delta 0), reused 0 (delta 0), pack-reused 0
Receiving objects: 100% (4/4), done.

Теперь откроем папку 'next-landing-lesson' в VSCode.

На этом вступление заканчивается, и чтобы перейти к нулевой части нужно перейти с ветки 'main' на ветку '0-install'. Для этого в github нажмите на селектор веток в начале страницы и выберите ветку '0-install'.

Увидимся в следующей части =)