Installation
Materio is built using Create Next App. Create Next App sets up everything automatically for you.
Guide
First of all make sure you have installed Node.js and pnpm / yarn / npm.
pnpm package manager is recommended
Please make sure you use the node's LTS version which is recommended by the official node site and not the one with the latest features or previous versions. Our project is not tested to work with other Node versions.
Before installing the node_modules
, make sure you have files starting with a dot (.eslintrc
, .env.example
etc..). It mostly happens when hidden files are not enabled on your machine and you try to copy our template at some other place on your system.
- After downloading zip, copy this zip to your desired location and then unzip it. Do not unzip first and then copy files to another location, it may not be able to run the template due to missing hidden files not copied over.
- In the uncompressed folder, you will find the
typescript-version
andjavascript-version
folders which contain thefull-version
&starter-kit
folders. Open the one you want to get started with in your code editor.
To configure your environment variables, follow these steps:
- Copy the
.env.example
file and rename it to.env
. - Fill in the required values in the
.env
file. - Make sure to write your secret in the
NEXTAUTH_SECRET
variable in the.env
file. You may generate your secret by referring to this link. - If you are using google authentication, make sure to mention your
GOOGLE_CLIENT_ID
andGOOGLE_CLIENT_SECRET
in the.env
file.
By following these steps, you can set up and manage your environment variables effectively.
-
Run the below command in the console:
- pnpm (Highly Recommended)
- yarn
- npm
pnpm install
yarn install
npm install
-
After installing the modules run your project with following command:
- pnpm (Highly Recommended)
- yarn
- npm
pnpm dev
yarn dev
npm run dev
-
You will find following output after running above command in console:
-
Congratulations! You have successfully run the project. Visit http://localhost:3000/ to check it in your browser.
Your network URL might not have same URL as screenshot and that is completely fine. It depends on your network.
If you want to change the port number, you can do so by adding --port <port-number>
or -p <port-number>
at the end of the command. For example, pnpm dev --port 3001
or pnpm dev -p 3001
.
Additionally, you also need to change the port number from http://localhost:3000
to http://localhost:<port-number>
in the .env
file. For the above example, it would be http://localhost:3001
.