Details 🔢

In this pull request we :

• Used Kanban board.
• Created the app & installed the dependencies.
• Created website header with NavLink.
• Created Rockets Section.
• Created Missions Section.
• Created My Profile Section.
• Used SpaceX API Data.
• Used Redux to handle the app state, and Duck Pattern.
• Used React-Redux as UI binding library.
• Used Redux Thunk as a middleware to fetch the data.
• Used React Spinners for Loading animation.
• Used Jest for testing.
• Created Error Page for wrong URLs.
• Added A Comprehensive README file.
• Deployed the App to Netlify.

ScreenShots

In this PR:

• Fetch the rockets information from the API
• Render the information in a list
• Feature all the reserved rockets in MyProfile section
• Apply basic styles

Missions

this pull request contains changes related to the missions section of the project,

Details :

• Created Basic structure for missions
• Fetched missions Data
• Displayed missions
• Implemented missions joining actions
• Implemented mission leaving actions
• Implemented conditional components for switching mission badges
• Added Error page to handle wrong URLs
• Added a background image
• Added style to the header.

Demo

The Project Setup

in this pull request we:

• created the project with CRA.
• Installed react/redux libraries.
• Installed linters ( Eslint / Stylelint)
• Added linter config files.

• Create a route and a view component. Use <NavLink /> for the page navigation links and style active class to indicate which section/page the user is currently on (underline active navigation link).
• This view should be empty - you will add content in separate tasks.

• Create a route and a view component. Use <NavLink /> for the page navigation links and style active class to indicate which section/page the user is currently on (underline active navigation link).
• Create a directory for all Redux state slice files.

• Create a route and a view component. Use <NavLink /> for the page navigation links and style active class to indicate which section/page the user is currently on (underline active navigation link).
• Create a directory for all Redux state slice files.

• Create a route and a view component. Use <NavLink /> for the page navigation links and style active class to indicate which section/page the user is currently on (underline active navigation link).
• Create a directory for all Redux state slice files.

Fetch data from the Missions endpoint (https://api.spacexdata.com/v3/missions) when a user navigates to the Missions section.

Once the data are fetched, dispatch an action to store the selected data in Redux store:

• mission_id
• mission_name
• description

NOTE: Make sure you only dispatch those actions once and do not add data to store on every re-render (i.e. when changing views / using navigation).

Fetch data from the Rockets endpoint (https://api.spacexdata.com/v3/rockets) when the application starts (as Rockets is the default view).

Once the data are fetched, dispatch an action to store the selected data in Redux store:

• id
• name
• type
• flickr_images

NOTE: Make sure you only dispatch those actions once and do not add data to store on every re-render (i.e. when changing views / using navigation).

Fetch data from the Dragons endpoint (https://api.spacexdata.com/v3/dragons) when a user navigates to the Dragons section.

Once the data are fetched, dispatch an action to store the selected data in Redux store:

• id
• name
• type
• flickr_images

NOTE: Make sure you only dispatch those actions once and do not add data to store on every re-render (i.e. when changing views / using navigation).