An aplication to search for popular movies consuming data from the movie database API

Overview
Nalu-JS Nalu-JS

JavaScript e DOM | API

Tópicos

Descrição do projeto

Resolução do desafio 7 days of code sobre JavaScript e DOM que consiste em consumir a API de filmes do The Movie DataBase e desenvolver uma página de filmes populares com JavaScript puro.

Funcionalidades

Além de listar os 100 filmes mais populares do momento, a aplicação permite:

  • Navegar pelas páginas de resultado,
  • Pesquisar filmes pelo título,
  • Favoritar/desfavoritar um filme (e salvar essa informação),
  • Mostrar apenas os filmes favoritados,
  • Selecionar linguagem português ou inglês.

Processo de Desenvolvimento

A partir desse desafio treinei:

  • Consumir uma API;
  • Utilizar o localStorage;
  • Manipulação do DOM;
  • Layout responsivo.

Screenshot

Mobile

Screenshot layout mobile

Desktop

Screenshot layout desktop

Status do Projeto

Finalizado

Linguagens Utilizadas

  • HTML;
  • SASS;
  • JS

Acesso ao projeto

Você pode acessar o código fonte do projeto. Também pode acessar a página para conferir o resultado final.

Autora

Nayara Luiza Tavares Moraes

You might also like...

Hemsida för personer i Sverige som kan och vill erbjuda boende till människor på flykt

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

May 3, 2022

Kurs-repo för kursen Webbserver och Databaser

Webbserver och databaser This repository is meant for CME students to access exercises and codealongs that happen throughout the course. I hope you wi

Jan 3, 2023

"Jira Search Helper" is a project to search more detail view and support highlight than original jira search

Jira Search Helper What is Jira Search Helper? "Jira Search Helper" is a project to search more detail view and support highlight than original jira s

Dec 23, 2022

A project aimed at consuming the Where is ISS? api to track the current position of International Space Station.

A project aimed at consuming the Where is ISS? api to track the current position of International Space Station.

ISS Tracker This project aims to create a website which tracks the live position of the Internation Space Station using this API. Issues: Call the api

Oct 21, 2022

Adapter application for consuming web3 messages from ie. wallets, and passing them on to starknet

🐍 StarknNet web3 account Development setup Clone deps with submodules git clone --recurse-submodules [email protected]:software-mansion-labs/starknet-we

Nov 21, 2022

Visualize, modify, and build your database with dbSpy! An open-source data modeling tool to facilitate relational database development.

Visualize, modify, and build your database with dbSpy! An open-source data modeling tool to facilitate relational database development.

Visualize, modify, and build your database with dbSpy! dbSpy is an open-source data modeling tool to facilitate relational database development. Key F

Dec 22, 2022

A movie schema sandbox for playing with EdgeDB and the EdgeQL query builder, pre-loaded with MCU data

The EdgeDB MCU sandbox 🦹 This is a sandbox for playing with EdgeDB and the EdgeQL query builder. It includes a simple movie database schema (dbschema

Nov 9, 2022

A personal semantic search engine capable of surfacing relevant bookmarks, journal entries, notes, blogs, contacts, and more, built on an efficient document embedding algorithm and Monocle's personal search index.

A personal semantic search engine capable of surfacing relevant bookmarks, journal entries, notes, blogs, contacts, and more, built on an efficient document embedding algorithm and Monocle's personal search index.

Revery 🦅 Revery is a semantic search engine that operates on my Monocle search index. While Revery lets me search through the same database of tens o

Dec 30, 2022

Tesodev-search-app - Personal Search App with React-Hooks

Tesodev-search-app - Personal Search App with React-Hooks

Tesodev-search-app Personal Search App with React-Hooks View on Heroku : [https://tesodev-staff-search-app.herokuapp.com/] Instructions Clone this rep

Nov 10, 2022
Owner
Nayara Luiza
SOFTWARE DEVELOPMENT STUDENT | JAVASCRIPT | NODEJS
Nayara Luiza
Movie application consuming The Movie DB's API

Movie application consuming The Movie DB's API

Pamella Fernandes 6 Aug 11, 2022
Rent-A Movie is a website based on movie renting. The user can leave likes, comments or make reservations for movies they would like to rent. Made using tvMaze API, Involvement API, HTML, SASS and JavaScript

Rent-A Movie "Rent-A Movie" is a website for movie renting where you can make reservations, add comments & likes or just get details about movies that

Zeeshan Haider 19 Aug 23, 2022
A fully responsive React app that allows you to search for movies from Movie Database.

A fully responsive React app that allows you to search for movies from Movie Database (IMDB Alternative).

Tushar Indurjeeth 3 Jul 16, 2022
A NodeJs service which allows you to create a movie based on it's title (additional movie details will be fetched) and fetch all created movies.

movies-api A NodeJs service which allows you to create a movie based on it's title (additional movie details will be fetched) and fetch all created mo

Ugochukwu Ejiogu 2 Mar 27, 2022
An open source movie library platform for viewing movie info and saving movies for later.

GoodWatch An open source movie library platform for viewing movie info and saving movies for later. How to get started? Fork and clone the repo. Then

null 13 Apr 28, 2022
Browse a list of your favorite movies and tv shows on the Steam-It Movie Database.

Preview Desktop view Stream-It The website allows users to browse a list of movies, like a movie, view and add comments to a movie Built With HTML and

Ben Kiarie 10 Sep 30, 2022
🟢 Music player app with a modern homepage, fully-fledged music player, search, lyrics, song exploration features, search, popular music around you, worldwide top charts, and much more.

Music-player-app see the project here. 1. Key Features 2. Technologies I've used Key Features: ?? Fully responsive clean UI. ?? Entirely mobile respo

suraj ✨ 3 Nov 16, 2022
Keep track of the movies you've watched and create your own movies lists!

Cinematek Keep track of the movies you've watched and create your own movies lists! All the movies informations are provided by The Movie Database Dep

Caroline Oliveira 8 May 23, 2022
A Hulu Clone which created with NextJS. It fetches the data from TMDB (The Movie Database) API.

A Hulu Clone which created with NextJS. It fetches the data from TMDB (The Movie Database) API. Click demo to try it by yourself! Hulu Clone Demo Link

Özge Coşkun Gürsucu 10 Aug 17, 2022
Grupprojekt för kurserna 'Javascript med Ramverk' och 'Agil Utveckling'

JavaScript-med-Ramverk-Laboration-3 Grupprojektet för kurserna Javascript med Ramverk och Agil Utveckling. Utvecklingsguide För information om hur utv

Svante Jonsson IT-Högskolan 3 May 18, 2022