The log of my #100DaysOfCode.
Started on Monday August 6, 2018 California PST.
e.g. R1D1 means Round 1 Day 1, etc.
Progress: I've started to setup more of the Twitter Clone project's UI layout and setting up some components and importing it into other parts of the website. I've also refactored some HTML layouts, and added some styling to the existing components. Thoughts: I might do a off-branding clone where I use a off-black/white theme over the Twitter's default blue theme. I might also redesign and redevelop the entire clone to make up for the lack of full functionality of the Twitter site since this is supposed to be a "basic" Twitter clone site. The goal is to really just for me to practice my full stack development capabilities.
I hope I'm doing this right in terms of the 100DaysOfCode challenge...
Edit: Started on Mortgage Calculator Project setup during night time.
Link To Work: Refer to Aug 6, 2018 Commits https://github.com/ewliang/TwitterCloneJS/commits/master
Progress: I started a different project I had on my list which is building a simple Mortgage Repayment Calculator using HTML, CSS, and plain old Javascript. The main focus of this was for me to practice my Web Design UI skills as well as to experiment with different color palettes. Another reason for this simple project is because I wanted to practice some Javascript too. I managed to finish it in a day. I did originally have a pre-made design in Photoshop, but I redesigned it with the new color palette and it looks amazing (compared to the old one that is)!
Minor code updates for the Twitter Clone webapp on the backend such as adding CRUD routes, initialized basic function skeleton, created a User Model, etc. Still needs work though for it to run properly.
Thoughts: A successful trial!
Link To Work: Refer to Aug 7, 2018 Commits https://github.com/ewliang/Mortgage-Repayment-Calculator/commits/master Demo: https://ewliang.github.io/Mortgage-Repayment-Calculator/
Progress:
- Updated personal website navlinks for consistency with framework. Still need to figure out why Bootstrap 4 menu doesn't collapse properly on mobile despite it being the same as the documentation...
- Updated personal website "About" page's "Accomplishments" section by changing it from a custom div layout to a table layout.
- Updated from Bootstrap 4.0.0 to 4.1.3
- Added data-toggle and data-target properties to navlinks so it collapses menu on page switch.
Thoughts: I'm very tempted to drop either the Twitter Clone project or the Blog project since they're very similar in terms of their underlying concepts. I am thinking of replacing it with a eCommerce store project I've been working on and making that open source. Hmm...
Link To Work: Personal Website Update
Progress:
- Minor updates to the Twitter Clone project (such as more module installations, added some minor code changes to backend, changed color from Twitter blue to black.
- Created Dockerfile for Goal Striver website refactorization blog module.
- Refactored Admin Dashboard files into new frontend client framework.
- Created more components for Twitter Clone and initialized page to show public user profile with tweets made by user.
- Created project for SellMyEbook powered by StripeJS website
Thoughts: This is going to be one long project... I also decided to drop the project about website redesign for 100DaysOfCode (fan mockup) and change the Weather Website Webapp practice project into a Android App (most likely going to happen) using Kotlin or Java - still debating.
Progress
- Focused on Goal Striver webapp development.
- Created Login Form
- Made model files for backend.
- Minor code updates.
Thoughts: Not too much progress. Have to plan this extra carefully.
Progress
- Created basic webpage using StripeJS payments.
- Worked on creating components and other login form elements for GS Dashboard.
- Worked on Pensieri project with minor code updates involving templates and communication with server.
Progress
- I focused mainly on making changes and small improvements to my personal website after receiving feedback from yesterday's Reddit suggestions from Showoff Saturday on the /r/webdev forum.
Demo: https://www.eric-liang.com
Progress
- Started converting PSD to HTML design for freelance client's website gig. I was playing around with Parallax. I also might consider a fixed background image design with vertical scroll approach. Not sure yet though.
Thoughts
- I took a break yesterday from coding. I wanted to brainstorm on some more useful ideas and approach towards the next major update to my personal website.
Progress
- Continued working on coding my freelance client's website. Experimenting with a 1 page section style. Also started converting it to a Wordpress theme to hopefully be a little bit more productive on that end. At first it seemed easy, but the design challenge is beginning to become a major challenge. Hmm...
Progress
- I decided to go with a hybrid design solution for my freelance client's website. I originally had 2 concepts that I came up with. One was a normal multisection site, and another was a fixed single screen background with no scroll. I decided to keep the fixed background approach and used a transparent scrollable body overlay solution as it solves any problems should there be any entries that exceed the room capable within a page. This was going to be a Wordpress theme after all. I mostly worked on fixing some javascript, removing some javascript, and modifying some HTML/CSS while I was at it. I was also able to remove the infinite scroll issue due to a parallax image that failed to disappear properly.
Progress
- Converted all the HTML/CSS/JS into Wordpress theme template files. Cleaned up some styles and made some minor/semi-major design changes to certain parts of the site. Also learned how to make custom post types in Wordpress. It was so easy!
Progress
- Made minor small detail update to my personal website blog's theme.
- Worked on adding Theme Customizer for Wordpress theme.
Progress
- Removed placeholder text from client's Wordpress theme website. Uploaded theme to website.
- Attempted to make a simple auth website in Nuxt using nuxtjs/auth library.
Progress
- Created a pure CSS full screen navigation menu. I plan to use this to replace my personal website's navigation bar since it seems to be broken.
Demo https://ewliang.github.io/Pure-CSS-Full-Screen-Navigation-Menu/
Progress
- Made passport based backend for API authentication login via Node.js. Oh yeah, this is a JWT stateless version. I have experience making basic stateful auths in the past.
Progress
- Made protected routes and minor adjustments to backend authentication API. Tested it against some scenarios, and it works the way it's supposed to! Time to jump onto the frontend...
- Added signup route controller to backend auth API. Has some minor errors, but it does register users to the database.
Progress
- Refactored some frontend code. Trying to refresh my memory on Vuex and still figuring out how to best approach Nuxt.js authentication via JWTs.
Progress
- Worked on trying to get Client's Wordpress theme to show custom post types' page title properly. I managed to get it to work after changing the music page template into a archive-music.php. Then I used the get_post_type or w/e function to grab the id of the post types and grabbed the title located in the functions for that type and outputted it to the "page" title. It works!
Progress
- Added formspree to my personal website's contact form. Works like a charm!
- Managed to get Vuex working properly so Front End authentication works with my API now. Time to move on...
Demo https://www.eric-liang.com/contact
Progress
- Improved UX by deleting "Join Now" newsletter page link on personal website and navbar. I'm considering on making it into a modal popup or section somewhere else.
- Fixed personal website's navbar toggle issue on page change from homepage to non-homepage based pages. Turns out it had to do with it not using the same navbar instance which is what I hypothesized to be the main concern.
Demo https://www.eric-liang.com
Progress
- Started creating a new Open Source project which is a website screencapture tool. So far implemented backend based on library to handle most of the heavylifting. Remainder of time spent mostly on trying to get full page screencapture to work.
Progress
- Managed to get full screen page capture to work properly with compatibility for lazy loaded image sites.
Progress
- Updated Mortgage Repayment Calculator with a new design.
Demo https://ewliang.github.io/Mortgage-Repayment-Calculator/
Progress
- Updated GhostJS theme with new p text color #838e9a and font weight change from 100 to 400.
- Updated Client's website with new style on homepage. Minor updates.
Demo https://www.eric-liang.com/blog
Progress
- Updated personal website via minor style change to navbar, homepage, and services page.
- Started working on some components for screenshot full stack vue.js app.
Demo https://www.eric-liang.com
Progress
- Updated snapshot webapp project to return a file upon successful screencapture.
- Added donation button to snapshot webapp.
- Coding up more of the frontend's functionalities (no design still).
- Got the picture sent from backend to frontend.
Progress
- Updated client's website with new font for headings (req by Client).
- Updated snapshotjs frontend with new components.
- Refactored snapshotjs frontend structure approach.
Progress
- Finally got image preview to work for snapshotjs. Wanted to do a Blob -> Canvas implementation but it didn't turn out well, so I ended up using since it works, easier, and it's backwards compatible.
- Fixed snapshotjs boolean value
- Added basic styling via SCSS.
- Tested everything to make sure it works properly (PASS)
- Updated with mobile friendly layout.
Progress
- Fixed cors issues and successfully deployed the server side of snapshotjs to finally work properly with Heroku
Demo https://snapshotjs.herokuapp.com
Progress
- Learned basic MochaJS and ChaiJS for unit testing.
- Created some simple testing for my Brevis URL Shortener project. No pushed update until I get it to fully work properly with my tests.
Progress
- Successfully created working tests for Brevis URL Shortener project using MochaJS and ChaiJS.
Progress
- Worked on updating my Pensieri full stack MEVN blog project. A little update on server side, and more updates on the client side.
Progress
- Made some small updates to client and server of Pensieri project.
Progress
- Started working on making a mini productivity Chrome Extension that auto closes distracting windows based on user input URLs. So far got a hardcoded URL to work, working on making user input and verification stuff to work properly.
Progress
- Made some style updates to client's website.
- Updated Chrome Extension to support multiple URL filtering.
Progress
- Added localStorage persistence for urlBlacklist.
- Added basic styling.
- Updated documentation for the Chrome Extension.
Progress
- Updated Chrome Extension with reset feature to reset the urlBlacklist as well as fixed localStorage usage so it's according to standards.
- Created a Chrome Extension Base Template repo for DRY future projects.
- Updated Chrome Extension UI style.
Progress
- Updated personal website with new portfolio entry.
Progress
- Updated personal website new portfolio entry info a bit more.
- Created a color contrast learning AI mini webapp using Brain.js library.
Progress
- Updated Color Contrast AI project by creating a JSON with material design colors with proper contrast text output result for initial training and implemented it in the scripts file.
Progress
- Updated Color Contrast AI training data with more json data.
- Made new changes to website portfolio now live...
Progress
- Added more colors to the Color Contrast AI training data set.
- Practiced javascript OOP on FreeCodeCamp.
- Made a simple vanilla JavaScript scraper via Google Chrome Console to scrape the colors off of Material.io for my Color Contrast AI JSON training data set file.
Progress
- I was experimenting with a stock API with brain.js LSTM function to try to create a stock prediction webapp. It's... ehh... I don't think I will upload the code.
- Made a clock using HTML, CSS, and Javascript
- Did some random Javascript Algorithm exercises on FreeCodeCamp
Demo Military Time Clock
Progress
- Worked on stock predictor, blockchain class, and a basic to do list app (still in progress) to practice javascript more.
Progress
- Worked on a new project called BookmarkAI. I found out it has some issues due to cors so I had to refactor into a Node.js server side project. Currently have the code setup so it can scrape the necessary data for training from URL. In the process of organizing my bookmarks so I can use it as training data...
Progress
- Minor updates to Blockchain javascript and Bookmark project.
Progress
- Updated personal website.
- Worked on BookmarkAI.
Progress
- Worked on BookmarkAI. Managed to get data passed properly and parsed. Still need to fix issues with async stuff.
- Updated READMEs for some old project files.
Progress
- Worked on BookmarkAI. Sadly no progress here since I am having trouble getting promises to work with axios while feeding in a array of URLs to GET and parse while inside a loop.
- Practiced JavaScript on codewars. Added solutions to https://github.com/ewliang/CodeWars-Exercises/tree/master/JavaScript
Progress
- Practiced JavaScript via codewars.
Progress
- Fixed BookmarkAI axios promises with loops issue with .all().
- Fixed BookmarkAI dynamic property name inclusion issue.
- Fixed invalid characters in Json.parse() string.
- Fixed training function for the most part on the /train route.
Progress
- Updated BookmarkAI so it covers the title non-existent issue. Tested prediction. It generates output when I changed the output training to just output: 'category', but it generates nothing when it was output: { category: 1 }. Will need to experiment more. Might have to actually encode training input data into values between 0 and 1.
- Did more codewars exercise.
- Updated ColorAI webapp style and layout.
Progress
- Codewars exercise
- BookmarkAI debugging.
- Practiced JavaScript on FreeCodeCamp for the algorithms section and learning reviewing Regex.
Progress
- Freecodecamp: Finished Regex and practiced some algorithm like problems as well as ES6 section.
- Codewars: Completed a exercise or two
Progress
- Updated Color AI project styling so it's more mobile friendly in design.
- Codewars and FreeCodeCamp javascript exercises.
Progress
- Reviewed basics of Docker
- Dockerized my Discord Bot project.
Progress
- Did more CodeWars exercise.
Progress
- Did more CodeWars exercise. Figured out one of my unsolved solutions. All I had to do was do a extra +i to the other condition for split-strings.js to work.
- Working on trying to get Vuex auth to work without auth module
Progress
- Updated JWT backend template documentation.
- Removed some packages from a nuxtjs project and managed to get the login to finally work with cookies. Still need to figure out how to keep user logged in when they make a new tab.
Progress
- Worked on trying to get the client side to work with my JWT backend. Added a logout route in vuex. Tested some functionality to make sure things work the way they should. I also found out I might need to create something on the client side to check whether a JWT is expired or not or maybe do it in the backend somehow. Still trying to figure out how to make new tabs persist logged in state.
Progress
- Did more FCC exercises on Javascript for ES6 destructuring and a few exercises on some problems.
Progress
- Created a simple Meme Generator using HTML5, CSS3, and vanilla JavaScript.
- Started working on a Gmail Bot project. Managed to connect to API and read message snippets and labels.
Demo https://ewliang.github.io/Meme-Generator/
Progress
- GMail bot can read full messages now.
Progress
- Learn React.js how to create elements with and without JSX.
Progress
- Learned more React.js concepts and practiced some React.js concepts on FreeCodeCamp site.
- Created a new repository with some setup files for my 1st SPA project using React.js (HackerNews Clone).
Progress
- Learned more React.js concepts.
- Practice coding on TripleByte
- Refactored some code for my HackerNewsClone project.
Progress
- Managed to get React.js working with stylesheets.
- Still need to figure out how to deal with images...
- Setup basic react-router routes for HackerNews clone project. Updated webpack to support routes.
Progress
- Learned how to use fetch to GET request via React.js for HackerNews clone project. Later switched to axios.
- Refactored pages in HackerNews clone project into separate folder.
Progress
- Updated jobs page for HackerNews clone with working nested GET requests for actual post data.
Progress
- Updated HackerNews clone in React with new styles for each list element.
- Added more info to show up per list item.
Progress
- Updated HackerNews clone with dynamic route to support seeing user profile.
- Added support for Comments section in Hackernews clone.
Progress
- Updated personal website.
Progress
- Created React.js project template based on webpack.
- Updated personal site.
- Made small changes to HackerNewsClone on local dev, sort of works on Heroku.
Progress
- Created a simple year progress app in React Native.
Progress
- Updated the labels and values for my Hourglass React Native project so it makes sense.
Progress
- Updated HackerNewsClone project to handle undefined null url cases which fixed crashing issue. Successfully deployed to heroku!
Demo https://hackernewsreactclone.herokuapp.com
Progress
- Started working on a webscraper to scrape CNBC pre-market data for the predictions for educational purposes.
Progress
- I managed to narrow down the scraper to retrieve the data, but then found out cheerio doesn't work properly with SPAs, so I had to redo the project using Puppeteer (partially done).
Progress
- Updated personal site with HackerNewsProject portfolio page entry.
- Finished CNBC Pre-market Web Scraper project.
Progress
- Started learning Next.js framework to redo Goal Striver's website using Next.js
- Worked on a event listener exercise on FreeCodeCamp site.
Progress
- Made a scraper for the WSJ site using vanilla javascript.
- Started coding new freelance client's website using Vue.js!
Progress
- Updated component styles for freelance client's website.
- Did more fixes and layout imports for the client website.
Progress
- Fixed freelance client's website so it's mobile responsive and the columns readjust size to fill screen on mobile device.
- Made navbar centered and collapsible.
- Added props to components.
Progress
- Fixed duplicate SCSS font import for client's website.
- Fixed client's website's related posts width overflow issue.
Progress
- Added more props support to more components of the client's website. Specifically images and some hrefs.
- Cleaning up code.
Progress
- Created more components, made sure all HTML styles were according to style guidelines for client website.
Progress
- Working on making updates to a revision of GS webapp via React.js
- Practicing JavaScript programming on Hackerrank.
Progress
- Practiced DOM manipulation via Frankenstein project.
Progress
- Worked on making some detailed changes to freelance client's Vue.js website.
- Started working on the backend of a new side project idea via Node.js/Express.js/MongoDB (private sourced project)
Progress
- Worked on fixing freelance client's Vue.js website's mobile design layout detail inconsistencies.
Progress
- Started making components for a CMS Dashboard for a old project of mine using React.js.
Progress
- Worked more on making components and styling the CMS Dashboard project. Trying to get routes to work and render the appropriate pages properly.
Progress
- Updated personal website. Removed useless pages and added some features.
Progress
- Started new project for creating a simple Lite dashboard for what could be my personal website's next major update. Added scss support and basic styling so far.
Progress
- Updated personal website pages with new content.
- Updated Dashboard Lite project with added line chart and minor style update.
Progress
- Updated personal website with new portfolio entry, content, and images.
- Updated services page.
Progress
- Created and started learning the ins-and-outs of Vuepress framework. Create nav, homepage, and title.
Progress
- Added Netlify CMS to Vuepress project.
- Updated libraries for BookmarkAI
- Created new project animation.css
Progress
- Managed to get Vuepress to work properly with Netlify CMS and get the content to show up on a /blog route after almost an entire day trying to figure out why certain things didn't show up.
Progress
- Figured out how to make different collection types with varying form fields, as well as fixed image display issue on vuepress by adjusting folder location and media_folder location in config file for netlifycms.