Skip to content

rickyalmeidadev/github-explorer

Repository files navigation

GitHub Explorer

Netlify Status

image

About the challenge

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.

Built With

  • 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.

Usage

The project is deployed and can be accessed at https://github-explorer-rickyalmeida.netlify.app/

Installation

  1. Clone the repository:
git clone https://github.com/rickyalmeidadev/desafio-reactjs-frontend
  1. Install packages:
yarn install
  1. Make sure the following port is available:
PORT: 3000
  1. Run the app:
yarn start
  1. Access the application through the following link afer doing the steps 1 - 4.
http://localhost:3000/

Structure

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

Author

Made with ❤️ by Ricky Almeida - email - linkedin