So Excited!!!!
I'm super excited about reworking this project. Meditation is a huge part of my day to day life and I like being able to look back and see what I've accomplished, see which types of meditation cause which mental changes, whether different times of day enhance or detract from the experience, etc.
The current iteration of the app isn't really all that useable to me. I can't wait to be able to move off of a tracking app that controls who gets my data and onto a self-hosted platform where I control my own data.
Refactoring My Meditation App
I've wanted to include more testing my projects for awhile now but many of the courses I took either didn't cover testing at all or skimmed over it briefly. I finally took the time to take a React testing course on Udemy and now I'm excited to get to refactoring my favorite project, My Meditation Timer & Tracker, using a Behavior Driven Development approach.
I recommend the course. It's React - Mastering Test Driven Development by David Joseph Katz. It is a bit old and I had to find some updated docs to get things to work, but the concepts are very sound.
What I'm doing different this time
SO MUCH TESTING. Really, really loving starting with a BDD approach. I'm so much more deliberate and organized this way.
I want to stick with exclusively React hooks this time. When I did the first run through I didn't understand hooks very well, and a lot of the documentation still only included Class examples. I'm a lot better with hooks now and they feel cleaner.
I'm completely ignoring styling for awhile. Part of the reason I want to use a BDD approach is that I can write my tests, create my components, get the functionality working and not be distracted by endless adjustments to margins and padding that would likely change in two days anyway.
I'm also debating whether or not to use a CSS framework. I used Material UI the first time around. It made putting the initial project together easier because I used Material UI Components. But it also left me feeling boxed into a corner as far as style goes a couple of times and I think I like the freedom of framework-less better. We'll see though.
Take a look and follow along
If I have the time and energy, I'm going to try to blog my process along the way. For now, take a look at my new repo and my first few issues:
App Needs Timer
#1
Timer should:
- Initially show a time of 00:00:00.
- Should have a start button
should run an increment function when clicked.
- Should have a Pause button
should run a Pause function when clicked.
- Should have a save button
Should run a save function when clicked.
Timer should Start, Pause, and Reset
#3
Timer Should:
'when clicking start button' =>
- Set timerOn state to true
- set timerTime to current timerTime state
- set timerStart time to current time: timerStart: new Date() - this.state.timerTime
- set timer to setInterval
(will need to add a pause button) 'when clicking pause button' =>
- set timerOn state to false
- clear timer interval
'when clicking reset button' =>
- set timerStart to 0
- set timerTime to 0
Hire Me
I'm looking for a new position. Please check out my projects page, my technologies and skills, and contact me at ali@alilynne.com if you're interested in hearing more!
Top comments (0)