The challenge was to build a single page application using ReactJS and the concept of declaritive UI to explore GitHub repositories and find details about them, such as number of stars, forks and issues.
- TypeScript - TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.
- ReactJS - A JavaScript library for creating user interfaces.
- Styled Components - Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress.
- Styled System - Styled System lets you quickly build custom UI components with constraint-based style props based on scales defined in your theme.
- React Hook Form - Performant, flexible and extensible forms with easy to use validation.
The project is deployed and can be accessed at https://github-explorer-rickyalmeida.netlify.app/
- Clone the repository:
git clone https://github.com/rickyalmeidadev/desafio-reactjs-frontend
- Install packages:
yarn install
- Make sure the following port is available:
PORT: 3000
- Run the app:
yarn start
- Access the application through the following link afer doing the steps 1 - 4.
http://localhost:3000/
src
├── assets
│ ├── icons
│ │ └── <icon-file-name>.svg
│ ├── images
│ │ └── <image-file-name>.png
│ └── styles
│ └── <style-file-name>.ts
├── components
│ ├── <component-folder-name>
│ │ ├── <component-file-name>.tsx
│ │ └── index.ts
│ └── index.ts
├── context
│ ├── <context-file-name>.tsx
│ └── index.tsx
├── helpers
│ └── <helper-file-name>.ts
├── interfaces
│ └── <interface-file-name>.d.ts
├── pages
│ └── <page-folder-name>
│ ├── <page-file-name>.tsx
│ └── index.ts
├── providers
│ └── <provider-file-name>.ts
├── routes
│ ├── <route-file-name>.tsx
│ └── index.tsx
├── services
│ └── <service-file-name>.ts
├── App.tsx
└── index.tsx