Mini projects built with HTML5, CSS & JavaScript Algorithms and Data Structures. No frameworks or libraries.
This document serves as a record of my progress in JavaScript Algorithms and Data Structures, tracking the challenges and projects I have worked on. It includes a structured list of algorithms, problem-solving techniques, and best practice implementations aimed at strengthening my understanding of JavaScript. Through these hands-on projects, I am improving my ability to write efficient, optimized code while reinforcing fundamental concepts such as data manipulation, control structures, and algorithmic problem-solving. This log not only documents my journey but also serves as a reference for refining my skills and applying best practices in real-world scenarios.
https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet
| 06 | Machine Learning Training a Sign Language Model | Live Demo |
Today's Progress: Fixed CSS, worked on canvas functionality for the app.
Thoughts: I really struggled with CSS, but, overall, I feel like I am slowly getting better at it. Canvas is still new for me, but I managed to figure out some basic functionality. Also, I never knew that the element is perfect for making games.
Link to work: snake game
Day 3-4
Today's Progress: Worked on main Flexbox and z-index deals with parent and children, hover mouse shows very nice background, click on any planet, and shows JSON specfic infomation. It deals with library TweenMax, but I can use transform or transition instead of but I did not.
Thoughts: I was struggling to understand how animationPlayState work such as "running": "paused". I have reviewed the docs on website that what I search for, so I can get their information and playing around with statement after click function. Also, I was using animation: rotate 4s linear infinite; and I have to put @keyframe for rotate from 0% to 360%. I had to look up on webstie to get some concept.
Link to work: Solar System project here
Day 7-10
Today's Progress: a simple CRUD project with Mongodb and Express
Thoughts: I need to improve on HTML radio. I had struggled with boolean
Link to Work:: CRUD Hockey Team Manger here
Day 11
Today's Progress: To play the game, you will only have 6 remain mistakes or your game will be over. It is fun to play the game to guess the letters!
Thoughts: I made a project with vanilla JavaScript. I have to create the split method and toUpperCase() because sometime user puts lower case. It will automate to captial letters no matter what. Also, it creates array so it can loop with length after random of array words that I make up the words. I learnt that the autofocus attribute in HTML could be input, button, textarea, and select. For one example, when we put html two input fields with an autofocus to force a blinking cursor to appear in your target field, which will draw the users eye and instruct them to begin typing. It cant have two autofocus only one. Same concept as id in JavaScript.
Link to Work:Hangman game DOM here
Day 11-12
Today's Progress: I had to look up at learn.Freecodecamp.org Curriculum on Object Oriented Programming section for couple of hours.
Thoughts: instanceof and constructor are similar. However, instanceof method is better over constructor because it checks the type of an object intead of overwritten. Also, the prototype is extremely useful for DRY because the properties are added all at once. I do not want to use the constructor to be duplicated variable.
Day 13
Today's Progress: I was working on .forEach vs .map method. I want to create multipy blue thin box identify each face recongoize. Clarifai is amazing API because they are using AI predict the picture such as apparel, celebrity, food, face detection, color, landscape, logo, travel and many more. For this project, I was using face detection so it can tell you specific value of width and height every time you uploaded the image.
Thoughts: I do not want to make only one box on face detection, so I have decided to use .map method creates a new array with value results every element before using the .map method there were SO many objects literal.I would like to lit bit clean up with new array after call the method, so I have decided to use the map method. When I use return, it will create new object that holds key pairs with array the result, but when I use foreach method is always return undefined because they are running once function for each array element. Also, forEach method does not mutate or change the array there is no way to stop or break. just remember that...
Link to Work:use the map Method to Extract Data from an Array and map and map vs forEach
Day 14
Today's Progress: work on true and false
Thoughts:
Link to Work: JavaScript OOP
Day 15
Today's Progress: Reviewed on amazing Express framework and several npm modules such as body-parser gravator jason webtoken mongoose express bcryptjs passport passport-jwt validator. I have updated some npm versions due to outdated and installed some tool 'nodemon' to save my huge time. I recommended you to intalled development dependency, not local dependency
Thoughts: I want to improve my skills keep in simple stupid (KISS) within just one hour.
Link to Work: package.json
Day 16
Today's Progress: working on basic To Do List and I have reivewed some another CSS framework
Thoughts:
Link to Work: Todo List