alejandroluishc / atramentum-react-challenge

React Challenge for Atramentum

Atramentum-react-challenge

This challenge is about creating a software that displays a table of customers from the given API. This data must be displayed in a friendly and scalable way and the user must be able to access to each customer's information and be able to update and modify the information with ease.

Check the deployed version here

Start 🚀

Get a clone of the project in local. You need to have installed NodeJS in your computer to develop the proyect.

Requirements 📋

You need to install nodejs

Go to NodeJS web page download and install the program.

Instalation 🔧

First clone the repository

git clone https://github.com/AlejandroLuisHC/atramentum-react-challenge

Then run 'npm install' in the base folder

npm install

Make sure you create a .env file using the .env.example provided

After this, open another terminal to run the server with 'npm run dev'

npm run dev

Built with 🛠️

• Vite
• React
  • useState(): a hook that allows you to add state to a functional component.
  • useEffect(): a hook that allows you to perform side effects in a functional component, such as fetching data.
  • memo(): a higher-order component that can optimize performance by memoizing the result of a component and only re-rendering it when necessary.
  • lazy(): a function that allows you to lazy-load a component, meaning that it will only be loaded when needed.
  • Supense: a component that allows you to suspend rendering while waiting for asynchronous data to load.
• Redux-toolkit
• React-router-dom
  • useParams(): a hook that allows you to access route parameters in a component.
  • Outlet(): a component that allows you to define a placeholder where child routes can be rendered.
• React-hook-form
• Styled-Components
• npm

Other libraries ⚙️

• react-icons
• react-hot-toast

Future Implementations 🚀

Here are some possible future implementations for this repository:

• Implementing a user login system to allow users to track activity on the platform.
• Adding more filters and sorting options to allow users to search through data more efectively based on different criteria.
• Adding a search functionality.

Possible Improvements 💡

Here are some possible improvements that can be tackled in future updates:

• Adding tests to ensure the stability and reliability of the platform.
• Making the platform more accessible by improving the user interface and ensuring that the platform is compatible with assistive technology.
• Improving the error handling by providing more informative error messages and guiding users on how to fix the errors.
• Adding multilingual support to make the platform accessible to a wider audience.

Feedback 📣

Completing this technical challenge was a great learning experience for me. It allowed me to keep honing my skills in React and Redux among other libraries.

Overall, I found this technical challenge to be useful and engaging, and I am grateful for the opportunity to have worked on it. I believe that this project helped me improve my skills as a developer, and I look forward to working on more projects like this in the future.