smashing-next

Advanced Next.js Masterclass: a workshop by Atila Fassina and Smashing Magazine

Stars
13

Setting up the system

Make sure you are running on Node.js 16 or newer.

If properly installed, Node.js will exist in your $PATH. To check the version you can then run:

node -v

In case you do not have Node.js installed, or needs a different for work, I recommend using a Node Version Manager, I recommend volta.sh.

# install Volta
curl https://get.volta.sh | bash

# install Node
volta install node

Project setup

  • Clone repository

    git clone https://github.com/atilafassina/smashing-next.git
    
  • Install dependencies with your package manager of choice (npm recomended)

npm i

If using VS Code, once the project is opened it will prompt you to install a few extensions. Those are definitely not mandatory, but are likely to give you a better Developer Experience.

Once ready, you can start the project and jump into code.

npm run dev

Open http://localhost:3000 to view it in the browser (unless you switch the port manually).

Setup the database

this is just a placeholder for now. We will provision and create our own data throughout the workshop.

At the moment you have no data, if you are using Xata VS Code extension, you can connect to a database in your workspace.

Once you have a XATA_API_TOKEN in your .env or .env.local, you can push the schema and generate the client:

npm run start:xata

It will create a table on your database and push dummy data there.