Next.js Typescript GraphQL Apollo Tailwind Framer Motion
To setup the project properly you need a Github Access Token to be able to use the GraphQL API and retrieve your data.
When you have the access token, you have to set in your .env
file at the root folder of the application like this:
GITHUB_ACCESS_TOKEN=xxxxxxxxxx
Be sure to replace the blank value with your personal access token.
- Login into your Github account
- Click on your profile picture at the top right corner of screen
- Click on settings in the dropdown menu
- Go to Developer settings
- Go to Personnal Access Tokens and Generate a new token
A .prettierc.json
is present to format components
, pages
and utils
.
You can format the files by using npm run p-format
and check if the files are respecting the rules by using npm run p-check
.
In the /graphql
folder you'll find a /types
folder that is referencing the types of all data that can be retrieved with the queries or mutations.
If you want to add queries, mutations or updated the existing one, you'll need to update the types files by running npm run codegen:generate
.
To generate the types you'll need the GraphQL schema of the Github API that can be downloaded by running npm run codegen:schema
that is already present in the repository, run the command to get the updated version of the API.
Check Apollo Tooling for more informations.
Install dependencies and run the application locally using Next.js.
npm install
npm run dev
The application integrate a Docker to easily run a instance of the project.
docker build -t github-folio .
docker run -p 3000:3000 github-folio
- Move the pagination system of projects from
updateQuery
toInMemoryCache
- Add more options and styles for the
/curriculum
page - Implement unit tests