You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Example Features: Show/hide text or component when a button is clicked.
Temperature Converter
Description: Create a converter that allows users to switch between Celsius and Fahrenheit.
Key Concepts: Managing state for inputs, performing calculations based on state.
Example Features: Input fields for temperature, conversion logic, display result.
Color Picker
Description: Build a color picker that updates the background color based on user input.
Key Concepts: Managing color state, applying styles dynamically.
Example Features: Color input field or palette, live color preview.
Simple Stopwatch
Description: Implement a stopwatch that starts, stops, and resets the time.
Key Concepts: State for time, interval management, useEffect for timers.
Example Features: Start, stop, and reset buttons, display elapsed time.
Light/Dark Mode Toggle
Description: Create a theme toggle that switches between light and dark mode.
Key Concepts: Boolean state for theme, dynamic class application or inline styles.
Example Features: Toggle button, theme-specific styles.
Accordion Component
- Description: Build an accordion where users can expand and collapse sections of content.
- Key Concepts: Managing which section is open, conditional rendering based on state.
- Example Features: Expand/collapse buttons, animated transitions.
The CSS should be supplied for the campers.
Acceptance criteria
Add your lab to the frontend-cert/react-projects folder
The text was updated successfully, but these errors were encountered:
Marking this blocked for now until we know what the final implementation for the editor will look like for react and typescript.
Oliver will let us know when.
At the time of this issue creation, Oliver is currently working on the making the changes to the editor to teach React and TypeScript.
For this lab, we need to create a project to practice working with state and the useState hook.
Here are some suggestions from ChatGPT on project ideas:
Counter App
Toggle Visibility
Temperature Converter
Color Picker
Simple Stopwatch
Light/Dark Mode Toggle
Accordion Component
- Description: Build an accordion where users can expand and collapse sections of content.
- Key Concepts: Managing which section is open, conditional rendering based on state.
- Example Features: Expand/collapse buttons, animated transitions.
The CSS should be supplied for the campers.
Acceptance criteria
frontend-cert/react-projects
folderThe text was updated successfully, but these errors were encountered: