I have decided to reformat most if not all journal entries from today foward to act more like a note taking platform and a more detailed description of what I am learning. I will be updating throughout my day, rather than at the end of the day.
This morning I went through a couple more hours of the Node.js course, and dove into MongoDB and how to get mongodb up and running in a node application and how to perform CRUD operations. I also learned how to utilize Promises, rather than proving a callback to each method, which makes things a lot less convoluted and easier to understand.
For example purposes lets pretend all of the following code is nested inside of the following call to MongoClient.connect The calls to console in the Then and Catch statements are for debugging purposes only.
MongoClient.connect(connectionURL, {useNewUrlParser: true}, (error, client) => {
if (error) {
return console.log('Unable to connect to database!')
}
const db = client.db(databaseName)
Today was a short one coding wise. Looked over the horoku/git commands to run and pull/push the apps I’ve been working on to another computer.
I styled the my Stock Charting app for mobile use and implemented responsive styling for the Chart.js app that I seemed to look over when designing it earlier this week. I love how it turned out. Take a look at it here
Learned A LOT today. Worked with the very begginings of databases with MongoDB in the node course I am taking. I think learning mongo is going to be fun and allow me to create a lot cooler apps for my portfolio.
Also learned how to deploy an app to Heroku and have a working app with node on the back end ready to use and test and ship out. I also finished my stock app and pushed that to heroku today. It can be seen here: Stock App
I didn’t encounter any issues today that would call for me adding the code to todays update. Overall good day!
Continued my node/express work. I continued progress and created a ‘stock’ app. I used chart.js to render the stock data (for the past month) to the page. I plan on integrating 5 options (1 day, 1 week, 1 month, 3 months, YTD, and one year) for the user to choose to see.
Started the day working on the second 100 days of css challenge and completed it. It took about an hour, but I really feel like I am already getting used to the css animations syntax. Got to play around with the clip path CSS as well which was fun. Here is the solution:
See the Pen 100 Dats of CSS #2 by Jordan Vidrine (@jordanvidrine) on CodePen.
Read More...Today I migrated my coding journey repository of .MD files to a github page using jekyll. It really wasnt too complicated after reading the docs and following the walkthrough to how it works.
I’ve been wanting to implement the blogging functionality to my coding log and am glad to be able to finally do it. I can now update my log from any of my computers using the git features in atom.
I had to install ruby on my desktop computer and I implemented the use of ROUGE which is a really nice syntax highlighter. I also styled the blog page pretty simply.
Take a look at it here
I’ve been feeling like my front end skills (CSS) are a little lacking so I think I’ll try and start working through the 100 days of css challenges in my spare coding time.
I looked over the first one today and was able to understand some of the more complex css like animations and keyframes and such. I used a .scss file and got a little more familiar with the syntax of that as well, using variables to help my code along. It is pretty much an exact copy of the code to match. I definitely could not solve this without looking over the solution.
See the Pen 100 Days of CSS #1 by Jordan Vidrine (@jordanvidrine) on CodePen.
Spent the first part of the day working through Eloquent Javascript chapters 8-9 on error handling and the dreaded regex. Not a huge fan of working with regex as it is pretty confusing but I do understand it and its purposes.
In the course today I went through more of using express inside of node. It is starting to get a little complex, which I like because it causes me to stretch my thinking and helps me to not get bored.
The task was to create a basic app front end and backend. In the backend we created a .get(‘/weather’) route where we send a search query and we are returned the weather info in JSON for what we entered in. Here’s what that looked like.
Read More...I finished the Drum Machine React App and uploaded it here. I am pretty proud of the way it came out as well. It was cool to finish this without really encountering any issues. I learned more about mouse and click events creating the app, but other than that, it was really easy.
Continued learning Node.js with a udemy course. Went through using routes and began learning the basics of the Express NPM module. Used that and handlebars ‘hbs’ in Node to go through a nice templating tutorial with custom routes.
Read More...I started off the day working on the Drum Machine App I began work on last week. I implemented a click and drag volume knob, as well as the ability to hover over the knob and increase/decrease the volume with the mouse wheel.
I added audio elements to each pad, that when clicked will trigger the corresponding audio sample for the pad.
Read More...