The Tomates Podres website shows a list of displayed movies and allows a user to see additional movie information and watch a trailer form the movie selected:
- Movies : when I visit the app, all movies should be displayed.
- Selected Movie: As a user, I can click a movie, and see that movie’s details. When a movie’s details are displayed, none of the other movies will be visible.
- When a movie’s details are displayed, the user should have a way to return to the main view of all movies.
Hi! My name is Joana and I am a current Front End Engineering student at Turing School of Software Design. I am a career changer! I've spent the last decade working to manage two small business, and grabbing the opportunity to move to another country. Now, I'm spending my days learning code. As a woman I can contribuit to build a more balanced society, where people can be seen as equals in the software marketing and where I can build apps more inclusive and make a difference using this huge platform of the internet!
Hello! I’m Meg, currently a student of the frontend developer program at the Turing School of Software Development and Design. Prior to making the decision to change careers, I worked with a company that manages the data for 911. This positive contribution to society is very important to me and what I would like to continue to do in the future as a developer with the incredible power granted by the internet to create positive changes . Outside of learning to code, I enjoy spending time with my family and friends and continue my effort to read as many books as I possibly can.
-
Gain competency with React fundamentals
-
Learn how to test React components & asynchronous JS using Cypress
-
Practice refactoring
-
Create a multi-page UX using Router
-
Project Spec: link
-
Miro Wireframing: link
- HTML
- CSS
- Lighthouse (Accessibility dev-tool)
- React/ JavaScript
- React Router
- Cypress
- NPM
- Fetch API
- ESLint
Fork this repo (look up in the top right corner) and copy the SSH link. Open your terminal, run git clone (replace the [ ] with the copied remote address) Change into the directory and run
npm i
To view, run:
npm start
or click the link:[Add deployed link here]
- A big win was to be able to create the React components and have them communicate as we wanted them to.
- Learning the behavior of JSX and how to apply CSS to those elements.
- Adding the stars for a user to rate a movie and be able to give those stars beautiful styling and functionality.
- Including a search bar for movie titles for better user experience.
- Being able to render the movie trailer successfully for the selected.
- Being able to successfully apply the Cypress testing.
- Having a Lighthouse score over 90, even as we were still getting used to using JSX.
- Balancing fun/life with project/work/study time 👩🏻💻💅🏻💆🏻♀️
- First project in React.
- Managing the media queries for responsive design.
- The battle of fatigue and productivity.
- Navigating the challenge of JSX styling.
- First project applying the Cypress testing suite.
- Add a user login/logout with username and password .
- Have an area of favorited movies.
- Be able to watch the movie in the website.
- The User's star rating will be saved within the user's account.
- Add an animation to the loading element.
- Add arrows or other design to improve the UX with the movie scoll on homepage.