rachelsoae/dnd-rookie-roadmap

📕 A D&D wiki-style experience for complete beginners. Start your journey here.

dnd-rookie-roadmap's Issues

Implement useReducer to DRY up fetch calls

Anchor links for rules pages

Refactor api calls with useLocation

Cypress testing

Deploy

Background image in place of white

error paths

Consider: refactor switch?

Optimize speed & processing

• after fetching, push to dummy array and then set state only once
• set loading state for each use effect and pass it down to appropriate dynamic pages

Move menu to dropdown

• Create a state 'isOpen' or 'isVisible' that stores a boolean, set to false
• When false, display "Menu" with a small down arrow, indicating a dropdown
• Set onMouseEnter event on Menu
• When mouse enters Menu button, toggle open/visible to true
• Conditionally render the main body of the menu to be visible when true
• Set onMouseLeave event on Menu
• When mouse leaves Menu button, toggle open/visible back to false

Routing with hard-coded data

As a user, I should be able to click each link and view the correct component.
The data displayed does not need to be dynamic at this stage.

Data architecture

• Outline data points to be used
• Draft component architecture
• Update wireframe with corrected headings

Implement Github Actions

fix paragraph formatting for rules

nav bar height

propTypes

Write API calls

• set state to empty arrays
• fetch all on page load
• once data is fetched, push it into the appropriate array
• pass the relevant states as props to the appropriate elements

"Jump to section" links

• Directory sections are displayed horizontally
• Top of page has HashLinks which scroll to desired link section

Possibly do the same thing with headers on info pages?

Collect initial design resourcees

• color palette
• font palette
• main background image
• collect images for resource pages

Create & connect repo

Change window title icon

Link logo to home page

make links more dynamic/DRY

Design - finesse

DRY up directories

Dynamic routing

Pass state and props as needed to render dynamic routes and URLs

Activate related links

add more related links to Class page

Refactor Cypress

Loading

• Add Loading component back
• Decide data flow and implement function code
• Test with throttling in browser
• Add Cypress tests

Remove related links

Make current page data persist on refresh

Design - responsive

Search icon broken

Search bar functionality

• Create Glossary
• When I search by keyword, I should see a search results page (Glossary) with only the matching results in the list

Related links

• Refactor side menu to populate related links, instead of navigation
• Fix bug where data does not pass through from resource page to related link resource when clicked
• Add additional links to Class page

Replace mock data with fetched data

Set up React components

• create component files
• initial design - layout, colors, fonts

Current/Active tab styling

DRY up repeated functions

Format incoming data

add proptypes to form (and loading?)