Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

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.

Awesome Lists containing this project

README

        

Project: The Mandalorian


logo

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).


weather

## 📝 License

This project is under the [MIT license](./LICENSE).