This project was developed using NextJS, TypeScript, SCSS Modules, and Jest for unit tests. The data is fetched from the swapi.dev API.
StarWars Universe Collection is a web application that showcases various collections from the Star Wars universe. The collections available are:
- Planets
- Spaceships
- Vehicles
- People
- Films
- Species
Each collection has its individual page, and every element is presented in a card format with an image and related information.
- Navigable Sidebar: The web app includes a collapsible sidebar for easy navigation between different collections.
- Home Button: By clicking on the StarWars logo in the header, users can quickly return to the home page.
- Pagination: Each collection is equipped with a pagination system for smooth browsing through multiple elements.
- Responsive Design: The layout of the web app is fully responsive, ensuring optimal user experience on various devices.
The following technologies and tools were utilized in building this project:
- NextJS
- SCSS Modules
- TypeScript
- Jest
npm run dev
npm run test
npm run test:coverage
The project has great potential for enhancement. Some possible improvements include:
- Add a Login Feature: Implement a login system to offer personalized experiences for users.
- Implement Infinite Scrolling: Replace the pagination system with infinite scrolling for seamless browsing.
- Explore SCSS and BEM Methodology Further: Dive deeper into SCSS and the BEM (Block, Element, Modifier) methodology for better maintainability and scalability.
- Optimize Unit Test Coverage: Continue optimizing unit tests to ensure extensive code coverage and overall robustness.
Feel free to contribute and explore these possibilities to make the StarWars Universe Collection even better!