Description
This is a React website using the Next.js framework with Firebase as a storage, where I can share my work and other stuff that interests me in order to keep it recorded.
I am also using next-i18n to translate some main texts in French, English or Japanese.
In order to update easily the website, write blog posts, etc. I've also built a dashboard accessible by authorized persons, with forms and a markdown editor :
Project structure
This project is separated in two groups:
- global : Pages that are visible by the public
- protected : Pages where I can manipulate the portfolio website's data
To restrain access from external persons, I've implemented a session-based authentication system using Firebase authentication with the Google provider.
To be able to do that, I've first setted up Firebase to block all other user's registrations
Once Firebase auth is setted up, I installed firebase's SDK for JavaScript, initiated it with all required keys then coded a middleware to check and save authentication information by using the cookies. If the current route is protected and if the user not is authenticated, then it will be redirected to the home page, otherwise he will be able to access the protected routes.
Database
I am using Firebase database to store projects, blog and gallery's data and Firestore for storing images. Here is the entity relationship diagram of the project :
