Example of a SEO friendly, performance focused website built getting data from a GraphQL query.
- Technologies Used
- Reports
- Architecture and Directories
- Local Configuration
- Possible Improvements
- Authors
- License
- HTML & CSS
- Typescript
- React
- Next.js for SSR
- NPM
- Github Actions for CI/CD
This section provides an in-depth overview of the structural design and organization of this codebase. It outlines the directories that make up the app's architecture, helping developers understand how the project is structured.
Project
├── .github
│ ├── workflows: Github Actions workflows
├── public: Public HTML, images, and other assets that are served as-is by the web server
├── src
│ ├── components: React components used throughout the website
│ ├── graphql: GraphQL-related code, such as queries, mutations, or schema definitions
│ ├── lib: Functions or code that is used across different parts of the website
│ ├── pages: Contains all pages of the app, with each file representing a route
│ ├── styles: Store CSS or stylesheets
|── .eslintrc.json: ESLint project configuration.
|── .gitignore: Specifies files to Git ignore
├── package.json: File that manages all the dependecies and contains script definitions.
|── next.config.ts: Next configuration.
|── tsconfig.json: TS configuration.
After cloning the project, enter in the project root and run the following command:
$ npm run setup- By default the application will be started at port 3000.
A system is never perfect and there is always room for improvement. Here are some points that I would like to enhance if I had more time:
- Improve mobile performance
 |
|---|
| Phillipe Martins |
See also the list of contributors who participated in this project.
This project is licensed under the MIT License - see the LICENSE.md file for details