Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/emeraldknight-sp/next-the-mandalorian
Simple Mandalorian page built with Next.js and styled using SASS. Integrates series data through a public API. Modular structure, easy to use and optimized for performance.
https://github.com/emeraldknight-sp/next-the-mandalorian
api axios lottie nextjs react react-lottie sass
Last synced: about 2 months ago
JSON representation
Simple Mandalorian page built with Next.js and styled using SASS. Integrates series data through a public API. Modular structure, easy to use and optimized for performance.
- Host: GitHub
- URL: https://github.com/emeraldknight-sp/next-the-mandalorian
- Owner: emeraldknight-sp
- License: mit
- Created: 2023-11-10T19:00:53.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2023-12-27T14:08:18.000Z (12 months ago)
- Last Synced: 2024-11-09T23:17:56.090Z (about 2 months ago)
- Topics: api, axios, lottie, nextjs, react, react-lottie, sass
- Language: SCSS
- Homepage: https://next-the-mandalorian.vercel.app
- Size: 5.4 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Project: The Mandalorian
This project involves creating a page dedicated to Disney Plus' renowned series "The Mandalorian". Developed using Next.js and elegantly styled with SASS, the page offers an interactive and informative experience about the saga. Integrating series data through a public API, the project stands out for its modular structure, optimized design and ease of navigation.
Technologies |
Project |
Layout |
License## 🔗 Links
[![Instagram](https://img.shields.io/badge/Instagram-%23E4405F.svg?style=for-the-badge&logo=Instagram&logoColor=white)](https://instagram.com/davidalmeidadev)
[![LinkedIn](https://img.shields.io/badge/linkedin-%230077B5.svg?style=for-the-badge&logo=linkedin&logoColor=white)](https://instagram.com/davidalmeidadev)
[![Brave](https://img.shields.io/badge/Portfolio-yellow?style=for-the-badge&logo=Brave&logoColor=white)](https://react-project-portfolio.vercel.app/)
[![Licence](https://img.shields.io/github/license/Ileriayo/markdown-badges?style=for-the-badge)](./LICENSE)## 🚀 Tecnologies
This project was developed with the following technologies:
- HTML5, CSS3, JS ES6+
- [Node e Yarn](https://nodejs.org/)
- [Next.js](https://nextjs.org/docs)
- [React Lottie](https://www.npmjs.com/package/react-lottie)
- [React Icons](https://www.npmjs.com/package/react-icons)
- [Typescript](https://www.typescriptlang.org/docs/)
- [Axios](https://axios-http.com/ptbr/docs/intro)
- [SASS](https://sass-lang.com/documentation/)## 💻 Project
In this project, I developed a page dedicated to the series "The Mandalorian" using Next.js and SASS for an efficient and stylized web experience. Next.js provided the ideal foundation, making it easy to create a single-page application with dynamic routing and server-side rendering. With the addition of SASS, we achieve elegant and modular styling, making the code cleaner and easier to maintain.
The integration of a public API enriched the page with dynamic data from the series, allowing users to access up-to-date information about episodes, characters and related details. Every technological and design choice has been carefully considered to provide an immersive experience for Mandalorian fans, while also serving as a practical example of good web development practices.
## 🏡 Get started
Installing project dependencies
```sh
yarn install
```Application initialization
```sh
yarn dev
```Application build
```sh
yarn build
```## 🔖 Layout
You can view the project layout by clicking [here](https://dribbble.com/shots/8359316-The-Mandalorian?utm_source=pinterest&utm_campaign=pinterest_shot&utm_content=The+Mandalorian&utm_medium=Social_Share).
## 📝 License
This project is under the [MIT license](./LICENSE).