Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/emeraldknight-sp/react-cineverse

This project emulates the detailed display page of an audiovisual product within a streaming platform using modern web technologies to build an interactive and dynamic interface that is able to compete with the quality of the streaming platform market.
https://github.com/emeraldknight-sp/react-cineverse

attack-on-titan axios context-api emotion landing-page react streaming styled-components

Last synced: 9 days ago
JSON representation

This project emulates the detailed display page of an audiovisual product within a streaming platform using modern web technologies to build an interactive and dynamic interface that is able to compete with the quality of the streaming platform market.

Awesome Lists containing this project

README

        

Project: Cineverse


logo

This project emulates the detailed display page of an audiovisual product within a streaming platform using modern web technologies to build an interactive and dynamic interface that is able to compete with the quality of the streaming platform market.


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/)
- [React.js](https://react.dev/)
- [React Icons](https://www.npmjs.com/package/react-icons)
- [Emotion](https://emotion.sh/docs/introduction)
- [Typescript](https://www.typescriptlang.org/docs/)
- [Axios](https://axios-http.com/ptbr/docs/intro)
- [Context API](https://www.freecodecamp.org/news/context-api-in-react/)

## 💻 Project

In this project I used React to bring to life a fluid and responsive interface using the resources provided by the @Emotion library (CSS-in-JS), working on the concept of modularization components were created, requests were made and handled with Axios to supply the context of the application within the Context API.

The code was treated with some linters and formatters to guarantee a cohesive and coherent code structure, thus reducing the chances of syntax errors occurring with Typescript and the automation process carried out with the help of Husky and Lint-staged.

## 🏡 Get started

Installing project dependencies

```sh
yarn install
```

Application initialization

```sh
yarn start
```

Application build

```sh
yarn build
```

## 🔖 Layout

You can view the project layout by clicking [here](https://dribbble.com/shots/16585818-Attack-On-Titan-Web-UI-Design/attachments/11611176?mode=media).


layout

## 📝 License

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