I made this playground to deepen my knowledge with React through applied examples, continuous learning, and daily practice.
Fun fact: I wrote a bash script to automatically update this changelog after each commit to the repo!
This changelog is a summary of development for the code content with my React playground
- Created Repo
- Created .gitignore
- Setup starter project
- Completed starter project 🥳
- Refactor starter project
- Begin OMO practice 1
- Finish OMO practice 1
- State! Oh how I love STATE!
- Controlled components and form markup
-
Finish form example
-
use form examples I know from work
-
two way binding, aka, a controlled component.
-
Data down, action up (via callbacks!)
-
Intro to filter
-
shorter filtering, looks pretty, but is it nicer?
-
removed short filter because who does that anyways?
-
prefer most common filter for this use case
-
Started parts on conditional rendering,
- I already knew the ternary way
- I already knew the "true && render this next thing" way
- I find it weird to split the check into two completly seperate checks, but could be nice as a pre-refactor step
-
Well thats new, I hadn't thought of using a let variable to store the default JSX (0 expenses from filter)
- Then we use a conditional to determine if we update that variable with the result of out filter data
- finished filtering and conditional rendering for expense tracker.
- Complete condition challenge: hiding the form.
- Build out the ExpenseChart Viewer
- Started the styling section of my react review.
- Worked on dynamic styles, and install styled components.
- Finished styled components examples
- Finished styled components props example
- Started css modules example
- Finish work on CSS modules and Styling
- Course Updated 10/23 and outdated content moved to legacy folder.
- Begin building out React Core Concepts Project
- Continue building out React Core Concepts Project
- tabButtons
- State
- Continue building out React Core Concepts Project
- Inspired Idea!: Adding react-syntax-highlighter for pretty code blocks
- Basic dynamic styles
- Finished building out MVP React Core Concepts Project
- Begin refactoring of React Core Concepts Project
- Splitting components
- Continue refactoring of React Core Concepts Project
- Tabs and TabButtons
- Reusable Section component
- Start adding React Router to expand project
- Continue with React Router
- Realize that React Router has changed much since 2021!
- Decided to revert RR implenmentation in react-concepts.
- Started the React Router tutorial in a seperate project for learning.
- Begin React Tic Tac Toe
- Player components
- Gameboard markup
- Happy New Year!
- Finish React Tic Tac Toe
- GameBoard adjustments
- Turn log
- Winning Combos
- Can restart game
- Begin work on React Investment Calculator
- Header Component
- Continue work on React Investment Calculator
- InputGroup
- Continue work on React Investment Calculator
- Results component
- Table Markup
- Derived table data
- Handle calculator edge cases
- Rename completed project folders
- Updated changelog!
- Update Changelog to auto update