100days-of-code-log
Challenge & Commitment
This is part of Alexander Kallaway's 100DaysOfCode challenge. More details about the challenge can be found here: 100daysofcode.com.
Commitment: I will code daily for the next 100 days.
| Start Date | End Date |
|---|---|
| July 29, 2020 | November 05, 2020 |
Goals
- Make a habit of coding and learn everyday
- Build projects for my portfolio
- Complete FCC certification
Log
Day 1: July 29, Wednesday
Today's Objectives:
- Start building project for FCC Web Design Certification
- Continue JS OOP course
Link to work:
New thing(s) learned: Today, I learned about protypical inheritance and composition.
Thoughts: Starting this challenge makes me more committed to finish project that I started. Feeling grateful and motivated to do more.
Day 2: July 30, Thursday
Today's Objectives:
- Start JS ES6 course
- Survey Form FCC Project
Link to work:
New thing(s) learned: Today, I learned about classes. How to create objects and implement inheritance by using classes.
Thoughts: Using ES6 is way more simpler and easier to write code e.g getters and setters.
Articles: I came accross with this article about motivation and productivity.
Day 3: July 31, Friday
Today's Objectives:
- Start Product landing page FCC Project
Link to work:
New thing(s) learned: None for today. But I was able to re-learn how to use illustrator. Still happy that I was able to do the simple things.
Thoughts: Today, I only coded for only few hours because I had a personal errand to do.
Articles: Here's the articles I came across with today. I will definitely check out the game tutorial by fcc and I'm planning to include a daily practice of solving programming problems to get comfortable with it.
Day 4: August 1, Saturday
Today's Objectives:
- Finish Product landing page FCC Project
Link to work:
New thing(s) learned: None for today.
Thoughts: Today, I took a break and did something like meal prepping(which will save me a ton of hours for the next days) and walking and getting fresh air outside. It feels nice and it's a way to keep away myself from burn-out. I was able to finish the project but my images can't be uploaded in codepen because I only have the free plan. I'm thinking about upgrading, but let me decide tomorrow.
Day 5: August 02, Sunday
Today's Objectives:
- Submit product landing page to fcc
- Build Login Page to practice vanilla js
Link to work:
New thing(s) learned: Today, I was able to explore a useful tool to save assets(e.g images) in the cloud which is cloudinary.com
Thoughts: I just realized that building projects are really helpful to gauge what I don't know yet. And for this, I will try to change the way I learn the concepts. I will build as I learn the concepts to fully understand it.
Articles: Here's the article I came across with today.
Day 6: August 03, Monday
Today's Objectives:
- Technical documentation page FCC project
- Free Portfolio Course by Laurence Bradford
Link to work:
New thing(s) learned: Today, I learned how important about having a portfolio site. It is an opportunity to show who you are and what you can do. It can also land you a new opportunities.
Thoughts: I was able to finish one fcc project today. I'm kind of having burn out for the past two days but I'm glad I'm back on track! Taking a break is really helpful. And I want to exercise often soon to help my body and mind to become more energetic and regain more focus.
Articles: Here's the article I came across with today. I'm interested to build a covid tracker so I would definitely include it in my weekly goal.
Day 7: August 04, Tuesday
Today's Objectives:
- Login page validation
- Free Portfolio Course by Laurence Bradford
Link to work:
New thing(s) learned: Today, I learned that I'm still having a confusion of manipulating arrays. I need to use the find method to check if the login input matches one of the array of users, instead of Object.entries method.
Thoughts: I need to practice more to fully grasp how things work especially javascript.
Articles: Here's the article I came across with today. The author created cool projects using free APIs.
Day 8: August 05, Wednesday
Today's Objectives:
- Finish Free Portfolio Course by Laurence Bradford
- Start registration form using react
Link to work:
New thing(s) learned: Today, I was able to use reactstrap for my registration form. Reading and understanding the documentation is something that I need to practice too.
Thoughts: Having a hard time to understand how to set a validation for the form today, I need to try this again tomorrow. Anyway, I finish the free portfolio course, I decided to build 3 big projects first before starting to build a portfolio.
Day 9: August 06, Thursday
Today's Objectives:
- Validate registration form
- Start Login Form using react
Link to work:
New thing(s) learned: Today, I learned how to use libraries for form validation. I also practice to code my own validation without dependencies so I can learn how it works. But it is a bit verbose, so using some 3rd party library are recommended. It is wat more cleaner and organized.
Thoughts: And I am back! I noticed that I was kind of losing motivation for the last few days. Building a habit for the past two months cause me to burn out. I had a progress but not consistent. So, this challenge is helping me to track what I learned in a day. And I will keep doing it, no matter what. :) So, I will focus on the things that matter. Practice will pay off soon.
Articles: Here's the article I came across with today. It's a great article. It hit me. :)
Day 10: August 07, Friday
Today's Objectives:
- Learning How to Learn Webinar by Michael Simmons
- Validate login form
Link to work:
New thing(s) learned: What I learned from the webinar is we have to be eager to learn, have the right strategy and believe in ourselves. If we are putting and pushing ourselves to do the uncomfortable things, then we have to do a delibrate practice to be comfortable with it and it doesn't stop there, we have to be constantly learning inorder to grow and learn the invaluable skills that will make us successful and achieve what we truly desire in life. Learning how to learn is one of the essential skill we should have.
Thoughts: Today, I got a migraine and a shortness of breath. I did the 'breathing on a paper bag' technique, it helped me to balance my breathing but my headache is still there. Took a med for the pain, rest for a while but it's still there. So yeah, this is due to the hot weather. So, I will only focus on the simple things right now.
Day 11: August 08, Saturday
Today's Objectives:
- Revisit my budget app
- Implement Routing
Link to work:
New thing(s) learned: I'm learning how to implement a routing into my app. I used react-router-dom.
Thoughts: Haven't done much today due to my migraine. Still thankful that I managed to sit down and start learning.
Day 12: August 09, Sunday
Today's Objectives:
- Start React Course
New thing(s) learned: None yet.
Thoughts: Haven't done much today but was able to start learning react course by Mosh. I want to learn how to integrate my login and registration form to my app.
Day 13: August 10, Monday
Today's Objectives:
- Continue React Course
Link to work:
New thing(s) learned: Since, I am trying to refresh my learnings from the course, now I have a clear understanding about controlled components. They are entirely controlled by its parent. They are stateless and simply receives data and methods to modify the data via props.
Thoughts: We had an exercise app from the course. And while doing the exercise based on my previous learnings, I finally solved it without even trying to copy the solution from the course. And I'm happy that I have a progress. :)
Day 14: August 11, Tuesday
Today's Objectives:
- Redirect login form to home
Link to work:
New thing(s) learned: I was able to use props of the router which is history to redirect the login page to home when successfully logged in.
Thoughts: Little by little. I am making a progress :)
Day 15: August 12, Wednesday
Today's Objectives:
- Do work shadowing with my mentor
- Learn form validation
New thing(s) learned: Been doing work shadowing for the past few days. While my mentor is working from home, I start to observe how he code/work and I was able to take some helpful tips and having an idea about react hooks.
Thoughts: Today, I was given some small tasks for a project. Since it is a way for me to learn and practice more, I will do it no matter how scary it is. I always think that I am not yet ready, but this challenge will give me the opportunity to learn deeply and make myself comfortable with the real world experience. And I am excited about it!
Articles: Here's the article that resonated with me today. It's a great article. Here's my take away: 'Some things don't make any sense today, but with patience and practice, it will eventually make sense one day, just continue showing up everyday'.
Day 16: August 13, Thursday
Today's Objectives:
- Do validation in update password form
- Implement same validation to registration form
New thing(s) learned: So today, I had to understand and read docs from validate.js to implement it to the task I was assigned today. It's new to me, and I was stucked by some problems but was able to get help from my mentor.
Thoughts: Tapping myself and feeling proud with a small achievement today! I was able to implement the validation and use other git command like creating a new branch and push it to the github.
Articles: Here's the article I came accross with today.
- 8 React.js Project Ideas to Help You Start Learning by Doing
- The Secret to Perseverance: How to Succeed as a Developer When All You Want to Do is Quit
Day 17: August 14, Friday
Today's Objectives:
- Fixed toast message, implement to all components needed
- Implement a switch toggle to enable or disable a user
- Make a date range filter
New thing(s) learned: Today, I got stuck with the switch and date range as I am still understanding the codes. Had a hard grasp on how things are connected.
Thoughts: This challenge is making me uncomfortable but this is the only way that I can learn it. So, I will tackle the problem again tomorrow. I hope it will stick and solve it as soon as possible.
Day 18-19: August 15-16, Sat-Sun
Today's Objectives:
- Make multiple switch work in a single component
- Forgot password form
- Redirect to reset form when email is sent
New thing(s) learned: Today, I am so happy that I learn how to implement forgot password and redirect it to reset password route and get the url params and used it for the endpoints. It keeps me excited even if it is hard.
Thoughts: I'm uncomfortable with what I do now, but it keeps me learning new things. It's not easy but I can do it. :)
Day 20: August 17, Monday
Today's Objectives:
- Finish forgot-password flow
New thing(s) learned: Today, I was able to implement the forgot password flow.
Thoughts: Saying yes to an opportunity that you can learn gives so much satisfaction when you finally solve it.
Articles: Here's the article I came accross with today.
Day 21: August 18, Tuesday
Today's Objectives:
- Implement enable-disable button
New thing(s) learned: Today, I was stuck on switch toggle. Still on the process of finding and thinking about a right solution to the problem.
Thoughts: There are days that I really want to punch in the air because I cant think of a solution on how to solve the problem, and today is unfortunately is.
Day 22: August 19, Wednesday
Today's Objectives:
- Implement enable-disable button
New thing(s) learned: Today, I was able to implement the enable-disable button using another solution. So, instead of using a switch button, I used a disable icon. When the icon is clicked, it will show a modal to confirm if you are sure to disable a user, then if yes the status of the user will change to disabled.
Thoughts: There are many ways to solve a problem. I need to learn and practice on how to think of the right way to solve the problem. There are times that the solution I choose to take is not the right way, I got stucked for days but the thing is I still learned. That sometimes, you have to check if the solution you are taking is somehow the right way inorder not to waste a lot of time.
Day 23-24: August 20-21, Thursday-Friday
Today's Objectives:
- Implement Filter with a date ranges
New thing(s) learned: Learning how to manipulate dates. It is kind of tricky the first time. But I need to understand it by reading the documentation. Right now, what I am using is moment.js
Thoughts: Getting comfortable with how to pass data via props from a child component to other parent. I had learn a technique from a mentor, and it is to make sure that it works first by doing console.log and checking it in the console.
Day 25-27: August 22-24, Saturday-Monday
Today's Objectives:
- Implement Filter with a date ranges
- Fixed Toast Messages
- Fixed Validation to login form, reset password form etc.
New thing(s) learned: Finally implemented the date range filter. :)
Thoughts: I noticed that whenever I got stuck with a problem, taking a break is a huge help. Sometimes, when I take shower or do something different, some ideas come and sometimes it lead me to the solution.
Day 28-29: August 25-26, Tuesday-Wednesday
Today's Objectives:
- Add custom to date filters
- Trim columns when the account role is user
- Commit and push the tasks done to merge with develop branch
New thing(s) learned: I finally manage to commit and push the tasks done. Then, I created a pull request in the bitbucket. I gotta admit, I enjoy it :)
Thoughts: There are things that I am afraid to do things at first. But with practice and courage to do it is something that will make me learn and grow. I just need to put myself out there and just do it anyway even if I commit a mistake at first. It's the only way I can learn.
Day 30-31: August 27-28, Thursday-Friday
Today's Objectives:
- Customized and fixed custom date range filter
New thing(s) learned: Working on custom date filter. Currently learning the styled components inorder to learn how to customize the calendar.
Thoughts: Still working on customizing the calendar, having a hard time to override the style because it used styled components. Hope to finish it tomorrow.
Day 32-33: August 29-30, Saturday-Sunday
Today's Objectives:
- Implement date range filter to another component
- Add another route regarding total hours calculations and create a table and display data
New thing(s) learned: I'm getting comfortable with fetching data using api endpoints. I'm also learning new command in git like merge, stash and i was able to delete branch whenever it is not needed anymore. Thoughts: console.log is a great way to check if your code works, you have to make sure that everytime you try things, you have to do console.log if possible to check if things are working before implementing the real block of codes.
Day 34: August 31, Monday
Today's Objectives:
- Change current datepicker library to (react-dates)
New thing(s) learned: I had to learn to use another datepicker library because I'm having a hard time to customized the previous one. So far, I was able to implement it successfully. Thoughts: Still having a hard time to understand the docs at first glance. Today, I had an issue regarding the datepicker, I cannot make the start and end dates from the parent to the datepicker dynamically. With the help of my mentor, he found out that I am not passing the correct value, it is because of my naming.. I was not being consistent with it and it caused some bug that is not easy to debug. Anyways, lesson learned! :)
Day 35: September 1, Tuesday
Today's Objectives:
- Working on react-dates datepicker
New thing(s) learned: Today, I was able to implement the new datepicker to the application. Thoughts: I need to practice naming the props with consistent naming, inorder to avoid confusion. And that's my next task :)
Day 36: September 2, Wednesday
Today's Objectives:
- Implement date-range-filter to other components
- fixed reg form validations
New thing(s) learned: Today, I was able to implement the date filter easily to other component. Thoughts: This learning journey is indeed helping me to learn how to think of possible ways to solve a problem.
Day 37-38: September 3-4, Thursday-Friday
Today's Objectives:
- Revisit my budget app
- Check new features needed
New thing(s) learned: I am trying to learn how use material ui. Thoughts: I will re-do my app and will use material ui.
Day 39: September 5, Saturday
Today's Objectives:
- Redo my budget app
New thing(s) learned: I'm having a hard time to understand material ui, so I will only use it for those components that's complex Thoughts: I have to practice to make my own components and try to make it responsive
Day 40-41: September 6-7, Sunday-Monday
Today's Objectives:
- Continue budget app
- Do tasks from my mentor
New thing(s) learned: I'm starting to learn how to make a form using a material ui. First time using grid.
Thoughts: It kinda hard but I have to continue practice it to be comfortable with it.
Day 42-43: September 8-9, Tuesday-Wednesday
Today's Objectives:
- Pair-programming with my mentor
- Do some tasks for my budget app
New thing(s) learned: Learned that making Constants if you have one is necessary when building an app to avoid having bugs/issues in the future. It is also easier to call it when needed instead of repeatedly typing it that can cause issues.
Thoughts: Learning a lot from my mentor. What we're worrking on is a bit complicated but challenging at the same time.
Day 44-45: September 10-11, Thursday-Friday
Today's Objectives:
- Do some tasks from my mentor
- Do tasks for my budget app
New thing(s) learned: Learning more about css, manipulating elements using transform property. Overriding elements when using material-ui components is a bit challenging.
Thoughts: I noticed that doing css really takes time at the start. I will take it as an opportunity to get comfortable with flexbox and other css properties.
Day 46-48: September 12-14, Saturday-Monday
Today's Objectives:
- Do the tasks from my mentor
New thing(s) learned: I am more on learning about doing some validation with form right now. Working with errors, so since I have a 4 grid options, if it is empty, then I need to show that the field is required. I got stuck because I use array instead of object. Using object is indeed the easier way inorder to pass the error value individually by using their unique id as a property of the object.
Thoughts: I was stucked with some problem for 2days. It is regarding with object vs array. I kind of using array instead of object which makes it complicated.
Day 49-51: September 15-17, Tuesday-Thursday
Thoughts: I wasn't able to do much because I had a headache coming from the back of my eye so I had to take a break.
Day 52-54: September 18-20, Friday-Sunday
Today's Objectives:
- Continue my tasks from my mentor
New thing(s) learned: I continued doing the mockups from my tasks.
Thoughts: I am getting comfortable with reading someone's code, it is a great opportunity to experience this kind of project. :)
Day 55-57: September 21-23, Monday-Wednesday
Today's Objectives:
- Revisit my budget app and continue the transactions
New thing(s) learned: I redid my budget app and learned how to turn my api's into a service.
Thoughts: Since, I am re-doing my budget app, I notice that it is getting over time :) Gotta practice more! :)
Day 58-59: September 24-25, Thursday-Friday
Today's Objectives:
- Continue the date range dropdown
New thing(s) learned: Im working on the the date ranges by period and custom dates. I got stuck but was able to do it on the 2nd day. But there's one thing unsolved yet, regarding on how to set the default value of the select material ui.
Day 60-64: September 26-30, Saturday-Wednesday
Today's Objectives:
- Finish date filter
- Start budget
New thing(s) learned: Slowly, I was able to finish the dropdown and start the budget in a week. I also do some mini tasks from my mentor like doing mock ups from time to time.
Day 65-67: October 1-3, Thursday-Saturday
Today's Objectives:
- Work on budget
- Start learning next.js for the blog
New thing(s) learned: I am starting to learn about next.js and it is kind of comfortable. I am excited because I am going to start my passion project which going to be my personal blog. :)
Day 68-70: October 4-6, Sunday-Tuesday
Today's Objectives:
- Learn responsive design for my next task from my mentor
New thing(s) learned: I had to stop learning nextjs and jump into responsive instead since we're going to work on the resposiveness of the project we're working on.
Day 71-74: October 7-10, Wednesday-Saturday
Today's Objectives:
- Do mobile responsive
New thing(s) learned: Learning how to do mobile responsive is a bit challenging because you have to consider the layout in all types of devices. It is also time consuming. I know, it will be a great experience for me because the UI is a bit complicated when it comes to mobile. It is entirely different from the layout in the bigger viewport.
Day 75: October 11, Sunday
Today's Objectives:
- Do mobile responsive
- Start login form from rummble
New thing(s) learned: Today, I have to learn how to manage my time. I am excited to start collaborating with a team and we are building a dribble clone project. So, I asked to be assigned in login/register form and it is kinda challenging because it is my first time using react-hook-forms and tailwind, so I am managing my time doing all of these and also doing responsive task from my mentor which is my priority becuase the launch will be in 5days. So, we have to finish it until tuesday. I can feel a lot of pressure here, but I have to calm down from time to time inorder to be working efficiently and being focused so I wont waste more time. It is exciting by the way! coz I know that I am learning more.
Day 76: October 12, Monday
Today's Objectives:
- Continue mobile responsive
- Continue login form from rummble
New thing(s) learned: So, I have finish the login form today. BUt i have to make some adjustments and break it into smaller components. I am still learning how to use tailwind, but i think this is a good resource to bootstrap an application or website. I am also continuing doing the responsive from my mentor. and yes, this is a hell of a work day but it is challenging. :)
Day 77: October 13, Tuesday
Today's Objectives:
- Continue mobile responsive
- Continue login form from rummble
New thing(s) learned: Today is my official first of my first pull request in github. I consider this as first because I am working on something that is beyond my level but I have to put myself out there and do something. I dont know if my code will pass but I have to take and learn from it. It's really challenging and exciting as well!
Day 78-79: October 14-15, Wednesday - Thursday
Today's Objectives:
- Sign up page for rummmble
- Nextjs docs
New thing(s) learned: I kind of having some thoughts if my code is right or wrong. I kind of worried but it is the only to learn and put myself out there. I have to learn from it. Whatever the feedback will be, then I gotta get it and work on it. I am also in the process of diving into nextjs right now. :)
Day 80-90: October 16-26, Friday - Monday
Today's Objectives:
- Budget App
- MM
New thing(s) learned: Hey, been a long time since I last record here. I was able to do a lot of things and been busy for the last few days so, its good to be back. To catch up, I deployed my budget app on heroku already, been working with some additional features and issues as well. Then, I already started a podcast so that's kinda sucking my time up for most of the time. :) But i do really enjoy it. On my blog project, i kinda out of track on that but i will get on it as soon as posssible..