I’m currently finishing up a Udemy course, The Web Developer Bootcamp. It’s a really popular course, and it’s been brilliant- I really wish I could have devoted more time to it lately! (But -ah, life, it has a funny way of getting in the way of things!)

The final project has been a web app called YelpCamp. Thinking over YelpCamp last night, I wanted to highlight the differences between static and dynamic web pages; it’s something you read about as a newbie, but I don’t think most people appreciate how different they are until they start working on a dynamic site.

A static site is not changed by the user. If you’re a freeCodeCamp user all of the pages you build in the front end section are static pages. The Tribute Page project- click here to check out my tribute page- is a prime example of this, it displays a page that is the same for every user, and doesn’t change until someone changes the code. Yes, some of the displayed info may change (like the weather app showing the current weather in different locations depending on where the user is,) but the user is not creating, updating, or destroying data from a database- only reading it.

A dynamic web page, on the other hand, can be altered by users creating, updating, or destroying (along with reading) data from the database. That means that as you create the site you need to bear that in mind and plan for not only the content you wish to include, but also user-generated content to come.

I haven’t deployed my YelpCamp page, but if you want to check out an example, I would suggest searching YelpCamp Heroku– plenty of people have deployed theirs.

Moving from static pages to creating a dynamic one, there was a lot to learn! Where a static page can be written with HTML & CSS alone, a dynamic page also needs to be able to interact with the database and determine what content to show. For that, I used EJS– Embedded JavaScript, which is a library which allows you to write markup to insert JavaScript directly into the HTML.

Being able to write the following code means the page can generate content as it’s added to the database:

<%= comment.author.username %>
10 days ago
<%= comment.text %>

Finding out how to create dynamic pages like this really made me feel like the secrets of the internet were unfolding right in front of me! As a total beginner this type of thing would have been a lot more difficult to understand, but at this point I can really appreciate how useful this is and I’m excited to be able to create more dynamic pages!