https://github.com/atikur-24/user-hub
Simple user list application
https://github.com/atikur-24/user-hub
css3 html5 javascript react-router-dom reactjs tailwindcss
Last synced: 3 months ago
JSON representation
Simple user list application
- Host: GitHub
- URL: https://github.com/atikur-24/user-hub
- Owner: atikur-24
- Created: 2024-03-01T13:24:43.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-03-01T13:28:01.000Z (over 1 year ago)
- Last Synced: 2025-01-22T21:12:45.431Z (4 months ago)
- Topics: css3, html5, javascript, react-router-dom, reactjs, tailwindcss
- Language: JavaScript
- Homepage: https://user-hub-a7a7e.web.app/
- Size: 180 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Simple User List Application
## [User Hub Live Link](https://user-hub-a7a7e.web.app/)
### How to run in this application ?
- Step - 1: git clone https://github.com/atikur-7/user-hub.git
- Step - 2: npm install
- Step - 3: npm run dev
### Functional Features and Design
- List all the users in a card layout as the page loads.
- Each card showing the user information, like user avatar, name, email, company name & address etc.
- When user click on a user’s name, it will open a separate page and will show user information in details.
- Implement a search functionality by user name.
- Implement sorting system based on user name, email and company name.
- Provide a form for users to input their information.
- Provide dynamic user data from api
- I will try design looking eye catching.
- In this application fully responsive for mobile, tablet and desktop devices.
### Wrote the code
- Component based design and create to re-useable component
- Used useState and useEffect hooks.
- Used custom hook.
- Used context api.
- Use React Router for routing.
### Used Technologist & Packages
- The website was built for client-side HTML5, CSS3, Tailwind, JavaScript, React.js.Using some packages are React router dom, React pagination, React toastify and React icons etc.