To get this React typescript application on your local machine, you need to follow the necessary steps
- Node.js (v14.17.6 or later)
- npm (v6.14.15 or later)
- Clone the repository or download the source code from GitHub. To clone it, use this command "git clone repo-link"
- Open a terminal or command prompt and navigate to the project directory.
- Run
yarn install
to install the dependencies.
- Run
npm i react-router-dom
to install the router library - Run
npm i framer-motion
to install the framer motion animation library
- Run this command
npx json-server --watch data/db.json --port 8000
in your terminal to watch the db.json file and wrap the API endpoint running on port 8000 - Run
yarn run dev
to start the development server. - Open a web browser and go to http://127.0.0.1:5173 to view the application.
The application displays a list of users on the homepage. Clicking on the "View full details" button on each user row will take you to a page that displays the selected user's full details. The data for the application is provided by a mocked API in the "data/db.json" file.
- React.js
- TypeScript
- Fetch (for fetching data and making HTTP requests)
- Tailwind CSS (for styling)
- Framer Motion (for loading animation)
- data/db.json: Contains the mocked API.
- src/components: Contains the React components for the application.
- src/App.tsx: Contains the routing configuration for the application.
- src/main.tsx: The entry point for the React application.
- src/useFetch.tsx: Contains the API implementation