Day 70: Form Validation in Vanilla JavaScript

I started working on the sign-up form project and things were going well. Tried some new CSS selectors out but got stuck on validation. I thought it was tricky in React. It’s a whole other adjustment using pure JavaScript. It may be tricky but this is why I’m doing this review to get these reps in and get comfortable being more versatile with pure JavaScript. I was hoping to finish the project in one day but the hiccups are making it look like a two day task.

TLDR;

Okay, so here are the highlights of what I did:

  • HTML -> Reviewed HTML input elements. Honestly working with forms is messy due to all of the default styling going on. I need to spend more time looking into how forms look on different browsers. I am sure articles exist, I just have not looked for them yet.
  • CSS -> Reviewed some more on attribute selectors. I learned that default attribute values do not count for selections. For example an HTML <input /> element by default becomes has it’s type attribute set to text (…I think). However, using a selector like input[type=text] will not work. It needs to explicitly stated on the element as <input type=text /> for the selector to work.
  • Practice -> Started working on the Sign-Up Page project from “The Odin Project” Full Stack curriculum. The styling was a fun experience but the form validation is the real challenge for me. I am so used to React controlled components that using Vanilla JavaScript and event listeners feels odd. It’s takes some adjustments but I will get there.


Goal For Round 7 of the #100DaysofCode Challenge

This is my seventh round of the “#100daysofcode” challenge. I will be continuing my work from round five and round six into round seven. I am currently working through the book “Cracking the Coding Interview” by Gayle Laakmann McDowell. My goal is to become more familiar with algorithms and data structures. This goal was derived from my goal to better understand operating systems and key programs that I use in the terminal regularly e.g. Git. This goal was in turn derived from my desire to better understand the fundamental tools used for coding outside of popular GUIs. This in turn was derived from my desire to be a better back-end developer.

I have no idea if my path is correct but I am walking down this road anyways. Worst case scenario I learn a whole bunch of stuff that will help me out on my own personal projects.