https://github.com/geetesh-gupta/exercism-hiring-assignment
https://github.com/geetesh-gupta/exercism-hiring-assignment
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/geetesh-gupta/exercism-hiring-assignment
- Owner: geetesh-gupta
- Created: 2022-03-27T17:43:28.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2022-04-09T04:16:11.000Z (about 3 years ago)
- Last Synced: 2025-02-08T15:13:52.700Z (4 months ago)
- Language: TypeScript
- Size: 1.58 MB
- Stars: 1
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Assignment solution for Exercism
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app) with **TypeScript** template and includes **Tailwind 3** CSS.
Deployed version of the project is available on [https://exercism-by-gg.netlify.app/](https://exercism-by-gg.netlify.app/).
## Project Structure
All the source code is present in the src directory with `index.tsx` as the entry point and other files are organized as given below
| Path | Description |
| ---- | ----------- |
| elements | Contains the basic building blocks, such as a button, icon, search, dropdown etc.|
| components | Contains distinct section of an interface (e.g. navigation bar) |
| pages | Implements a particular template for each route |
| hooks | Contains the custom React hooks |
| tests | Contains the corresponding tests |
| types | Contains the common types used among the components e.g. API request/response |
| utils | Contains common utility functions used by the components |
| App.tsx | Main file to handle the top level structuring of pages |
| styles.css | Acts as the global style file and import the Tailwind css styles |
## Features implemented
- Testimonials Container component based on the Figma design
- Filters based on track, page number, exercise and sort type
- All the functionalities mentioned in the requirements like reducing the API calls while the user is still typing.
- Responsive and fully implemented Navbar
- Add Responsiveness to the Testimonials Container component as well. See the sample image in the next section.
## Sample Images of the deployed website
### Testimonials page
#### Desktop View
#### Tablet View
#### Mobile View
### Pagination Container
#### Desktop/Tablet View
#### Mobile View
## Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
The page will reload if you make edits.\
You will also see any lint errors in the console.
### `npm test`
Launches the test runner in the interactive watch mode.\
### `npm run build`
Builds the app for production to the `build` folder.\