Learn Bootcamp From Zero

What is Association? Association will allow us to have multiple pieces of data collections in our database that are related to one another. Just like a Facebook user can have multiple posts or images in his account. Three Types of Association One to One:   One of entity that's related to one another entity. For example, one student has one unique student ID. One to Many:  One entity that's related to many of other entity. For example, one student has multiple social media accounts. And those social media accounts only belong to this student. Many to Many:  Many entity related to both ways. For example, one student can take many course, and one course has many students. Embedded Data In this example, we will do the "One to Many" type. We have user and post. We want one user to have multiple posts. Step One: Set up and define schema Firstly, we need to create a new file "embed,js", and npm install mongoose. Then, we require the mong...

The course shows us we can make API's requests with Node. The first thing we need to do is to create the "APIs" directory and touch "request.js" file inside that folder. Then, we need to npm install request package in the APIs directory. Once we have done those basic steps, we can start to require the "request" and make a request from a JavaScript file. In the request, we need to have the "url" , so the server knows where it should request the API. Next, we need to have a function. request("url", function(error, response, body) In the function, there are three things we pass in: error, response, and body . Error: it will hold any potential error that we get such as internet disconnect, 404, and etc. It is important to check for an error. Response : it will be the incoming message that we receive Body : it is the actual response body that came back like HTML code For example, in the "request.js" ...

So far I have learned from the course is all about GET Request which is retrieving information. We run app.get("url", function) in our application. Today, the course shows us how to develop a Post Request by creating a simple friends app. The friends app is a list of friends. There is a form at the bottom, so we can submit a new name to add a new friend to the list. How to develop a post request app? Step One: Set up basic route We create a new directory "PostRequestDemo" under "MoreExpress" directory. Then, in this new directory, we install the express and ejs, and also create a new file "app.js". In the app.js file, we require the express, set up the app, and write a test route "home". We want to make sure everything is connect correctly. Then, we write "/friends" route to render to "friends.ejs" page. In the friend.ejs, we write a simple h1 tag "friend list".  Then, we run the app and see...

So far, we only have simple HTML tags and ejs tags in each ejs file. Every template page has no style at all. And the basic HTML header and footer are also missing. Today, I learned how to add styles and partials in ejs file. Link Style Step One: Touch a Separate CSS file I create a new directory "Style" under the "EJSDemo" directory, then I add a new CSS file "app.css" inside "Style" folder. Step Two: Add app.use(express.static()) in the app.js I add app.use(express.static("style")) in the "app.js". This will tell Express.js to serve the content of "Style" directory. Step Three: Write styles in CSS file I simple give body an orange background color and set text color to be grey. Step Four: Link to CSS file in the EJS file I just add <link> tag to link the "app.css" file on the top of the h1 tag in each ejs template. As the result, when I run the app and...

Last post, I have learned to develop my first Express App from the course. Basically,  it has three routes. When we type "/", "/bye" and "/cat", the app will receive the request and send the matched response to us. But, if we want to send a nice message when users type other texts after slash, what should we do? We can write a "*" route which will run whenever out app gets any request to any url aside from those three routes that we have already defined. app.get("*", function) In the App.js file, we add a new star route, and it will send you a new message whenever you type any undefined request. I run my app, and put some random texts after slash, and hit enter. All I get is "You are a star!". If we move the star route to the top of those three routes, what will happen? The instructor run the app, the result is even though we send the "/", "/bye" or "/cat" request, all we get...

In the last post, I shared my study note about five DOM methods of selecting the element. The next step will be manipulate those selected element. Remember the whole process is select an element and then manipulate. There are different ways of manipulation: changing an element's style adding/removing classes changing the content of a tag changing attribute. Style The style property is one way to manipulate an element's style. I will continue to use the previous HTML page as an example. var tag = document.getElementById("highlight");  //select tag.style.color = "blue"  //manipulate                                      tag.style.background = "pink";  //manipulate In the example, I select the ID element which corresponds to the first list item. I changed the text color and background by manipulating style in JavaScript. As you see, the text co...