rise-of-skywalker's People
Forkers
naomikc92rise-of-skywalker's Issues
Improvement opportunities outside initial scope list
- UI polishing is needed around User Profile and navigation area
- Buttons interactions (animations) when viewing characters or toggle favorites can be helpful visually for users
- Favorites page styling
Major styling overhaul for multiple Components
Major styling overhaul that should be done for the application to feel more user friendly.
This should be discussed this weekend 12/7 - 12/8 before we work on it (and after other functionalities and testing are more stable).
Iteration 3 - Characters - Part 1 - View Characters
- the route should be /movies/:movie_id
Iteration 3 - Characters - Part 2 - Opening Scrolling Text
- View Characters button clicked should lead to this page /movies/:movie_id that displaying scrolling text of the particular episode selected
Splice out release_date to only show the year in this format YYYY
Iteration 1 - Landing Page - Part 2 - error handling
- An error message should appear if one of the inputs has not been filled out.
- All inputs must be filled in order for the user to sign in.
Iteration 3 - Characters - Part 3 - Data for each Character card
- All the cards for each character should have
- Name
- Homeworld
- Population of Homeworld
- Species
- Related Films
- A button to "Favorite" the person/character
Iteration 1 - Landing Page - Part 3 - overall design and styling of landing page
Iteration 2 - Movies - Part 1 - redirect to /movies
- All 7 films should be displayed
- order by episode number (1 - 7 based on the data available)
- title, episode, release year
- View Characters button should be available
Iteration 2 - Movies - Part 2 - Movies UI and UX (include sign out)
- User's profile data should be displayed at all times on this page (/movies)
- User's profile data consists of name, favorite quote, ranking
- Make sure sign out button is also available along with user's profile data
- Sign out button leads user to root route (/)
On the movies list page, background should fill the whole page
Snapshots UI Testing for ALL Components
Async Testing
Iteration 1: Landing Page - Part 1 - main route with form inputs
-
When the app starts up on the root route, /, the user should be introduced to a welcome form asking for the user’s name, favorite quote from the Star Wars films, and must select a ranking on how familiar they are with the Star Wars universe.
-
At least three categories (We are going to do Youngling, Padawan, Jedi Knight, and Jedi Master)
Add navigation to the application - Favorites, Sign out, UserProfile details, back to movies list
Navigation should cover
- Favorites page
- Favorites counting (?)
- Sign out button for the user
- User profile details include (name, rank, quote)
- Button to get back to Movies/Episodes list
Iteration 3 - Characters - Part 4 - Favorite feature
- Favorites button on the Characters page to link user to /favorites
- This button should show the count of favorited items in the button text
- Users should be able to unfavorite a card both on the relevant route (/movies/:movie_id) and (/favorites)
Iteration 1: Initial Experiment with fetching data into allMoviesData state inside App
- Start fetching in apiCalls and getting all the movies data in react lifecycle method componentDidMount()
- Basic setup and getting the data from the fetches
Add conditional rendering while waiting for the CharacterContainer to load with all the cards
The nested fetching to load each character information can take some time. Need to add a conditional rendering with a visual to signify the page is loading.
Edit to add scope of this ticket:
- Conditional rendering isLoading status should include both MovieContainer and CharacterContainer
- When switching between episodes, characters rendering to update list of characters do take time (can display previously viewed episode characters for up to 5 seconds before rendering)
Event Simulation Testing + Changes in State Testing
Final check before turning in for Snapshot UI Testing
Update any snapshots as necessary since there might be some small changes coming in before cutoff.
Fix the fetching to get characters for each episode
https://swapi.co/api/films/`NUMBER`
1
-> episode_id = 4
2
-> episode_id = 5
3
-> episode_id = 6
4
-> episode_id = 1
5
-> episode_id = 2
6
-> episode_id = 3
7
-> episode_id = 7
A fix is needed for the fetching inside apiCalls.js file
Practice fetching and get familiar with the codebase in structuring the data required to display
- fetching
- nested fetches starting from https://swapi.co/api/films and dive into homeworld, species, characters, population, name, films the character appear in.
Iteration 3 - Characters - Part 5 - No favorites handling
- If there are no favorites, show a message indicating there are no favorites currently
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.