Created with NextJS combines both backend and framework into a single app. React based for the fronted communicating with the back making use of a GraphQL API.
-
The
/pages
folder contains the routing of the app -
The
/components
folder contains all the reusable react-based components -
The
/api
folder contains a backend model based on- An GraphQL API using micro apollo
- A sequelize ORM with the model and migrations to connect to a sequelize DB
-
The
/config
folder miscellaneous config for multiple purposes including DB credentials
/ setlife-solutions
|_ config
|_ components
|_ styles
|_ pages
|_ api
|_ v1.ts
|_ migrations
|_ models
|_ graphql
|_ schema
|_ index.ts
|_ resolvers
|_ types
- Clone the repo
git clone https://github.com/setlife-network/setlife-solutions.git
- Install packages
cd setlife-solutions
npm install
- Copy the sample environment configuration file
cp .env.example .env
-
Obtain a
.env
file from a project maintainer or fill out your own values -
Run the app
npm run dev
-
UI should open in the browser at
localhost:3000
-
An API Explorer is accessible in the browser at
localhost:3000/api/v1
- Download PostgreSQL v14 with the client of choice from here https://www.postgresql.org/
- Create a database and setup the
.env
file with the corresponding credentials - Generate the tables running the migrations
npx sequelize-cli db:migrate
- Start the app
npm run dev
This is a Next.js project bootstrapped with create-next-app
.
First, run the development server:
npm run dev
# or
yarn dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying pages/index.tsx
. The page auto-updates as you edit the file.
API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts
.
The pages/api
directory is mapped to /api/*
. Files in this directory are treated as API routes instead of React pages.
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.