Afrisplash-Frontend
Preparation for Installation
Tech Stack
React - Nextjs :smiley:, TailwindCSS :hugs:, Redux :relieved:, Sass :wink:.
Run Locally
Install dependencies
npm install
Add the below config to your .env file
NEXT_PUBLIC_BACKEND_URL='Afrisplash Backend Url'
NEXTAUTH_SECRET= 'Afrisplash Next Auth Secret'
NEXTAUTH_URL=http://localhost:3000/
PS: Please reach out to any of the Project Maintainers for the NEXTAUTH_SECRET and NEXT_PUBLIC_BACKEND_URL values
To run project;
npm run dev
Docker setup
To setup up with docker build the image using
npm run docker:build
To run containner
npm run docker:publish
Available dependencies to help with project build process :nerd_face:
| Dependency :ok_hand: | Link to documentation | What is it used for |
|---|---|---|
| Heroicons | https://heroicons.com/ , https://unpkg.com/browse/@heroicons/[email protected]/24/outline/ , https://unpkg.com/browse/@heroicons/[email protected]/24/solid/ | A repository of icons, you can call project icons from here |
| Nextjs | https://nextjs.org/docs/getting-started | React framework to run the entire project |
| TailwindCSS | https://tailwindcss.com/docs/ | CSS framework for styling |
| Typescript | https://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes.html | For strict typing and error handling for type checking |
| Sass | https://sass-lang.com/documentation/ | For better style handling, Please use the SCSS syntax |
| Redux | https://redux.js.org/tutorials/essentials/part-1-overview-concepts | For state management |
| Axios | https://axios-http.com/docs/api_intro | For API calls |
Please do not re-install any of the dependencies above because they all install when npm install is ran
How to contribute
- Read this read me file :thumbsup:.
- Pick an issue in the issues section.
- Pick an issue by commenting on the issue you are currently working on
- Clone project to your machine.
git clone <get_link_from_github_page>
- When you're done solving & implementing.
- Checkout to a new branch.
- When your code is in good shape, send a PR merge request to the branch called "development".
- Remember to update your codebase
- Project mainter will then review & merge to "master" or reach out with feedback.
Task
