alysonvilela / a7yson Goto Github PK

The entire project was developed in live-coding I do at twitch 3 times a week and several problems were solved in it. Responsiveness, language transition, SEO were some of them. From the beginning, the intention of this project was to make this format available to the community, that is, you can copy the entire project, but try to understand the process. The first part was simple HTML and CSS, so that the responsiveness process was faster, I used BootStrap as a CSS framework. After building the simple, we moved to automation and componentization, using ReactJS. All routing, SEO and performance tweaks were done with NextJS. And finally, using DatoCMS as content manager and generating dynamic routes with NextJS.

Were developed from the UX/UI Design part to the front end with fetching data. You can find the simple site build (HTML/CSS/JS) in the /public folder and see the transition from basic to React and Next.

• Adobe XD for wireframing and prototyping
• HTML / SCSS / JS
• Bootstrap 5.0.2
• Typescript
• React.js
• Next.js
• GraphCMS

During the construction process, some items of the framework's functioning were used:

• CSS Frameworking
  • Bootstrap 5.0.2
• React components
  • useState
  • useEffect
  • Contexts
  • Hooks
• Nexts components
  • Routing
  • getStaticProps
  • Image Optimization
  • _documents and _app
  • Data Fetching
  • Slug

1. Install node
2. Fork or clone this project git clone 'link'
3. Install dependencies npm install
4. Run the project npm run dev