# Mandatory Course (Udemy)

[The Complete 2024 Web Development Bootcamp](https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12638830#notes) (accessible on Udemy via LEARN app)

1. You are encouraged to go through this online course before the programme so that you can get a good sense of what is needed to build a web app during the programme. 
2. We have selected a few of the more important modules below that we recommend participants to focus on for essential foundation knowledge. 
3. As coding is a skill that takes consistent revision and practice to build, we strongly recommend officers to come in to TechUp having perused the topics (even if briefly) and bring any questions you have, so that TechUp can serve to reinforce key concepts and skills in web development.

{% hint style="info" %}
Those indicated in❗️**bold are mandatory for TechUp**. 
{% endhint %}

{% tabs %}
{% tab title="❗️Front-End + HTML" %}

<table><thead><tr><th width="231">Title</th><th width="190">Udemy Link</th><th width="150"># of Lectures</th><th>Duration</th></tr></thead><tbody><tr><td>❗️<strong>Front End Web Development</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12638830#overview">Udemy Section 1</a></td><td>9</td><td>37 min</td></tr><tr><td>❗️<strong>Introduction to HTML</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/37390282#overview">Udemy Section 2</a></td><td>8</td><td>51 min</td></tr><tr><td>❗️<strong>Intermediate HTML</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/37349778#overview">Udemy Section 3</a></td><td>7</td><td>51 min</td></tr><tr><td>❗️<strong>Multi-Page Websites</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/37349942#overview">Udemy Section 4</a></td><td>7</td><td>1 hr 10 min</td></tr></tbody></table>
{% endtab %}

{% tab title="❗️CSS" %}

<table><thead><tr><th width="296">Title</th><th width="159">Udemy Link</th><th width="124"># of Lectures</th><th>Duration</th></tr></thead><tbody><tr><td>❗️<strong>Introduction to CSS</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/37350296#overview">Udemy Section 5</a></td><td>6</td><td>59 min</td></tr><tr><td>❗️<strong>Intermediate to CSS</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/37350528#overview">Udemy Section 7</a></td><td>5</td><td>1 hr 33 min</td></tr><tr><td><p><a data-footnote-ref href="#user-content-fn-1">Bootstrap</a></p><p>Helps you with nice default HTML elements like buttons and nav bar</p></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/37368626#notes">Udemy Section 11</a></td><td>4</td><td>1 hr 40 min</td></tr><tr><td><p><a data-footnote-ref href="#user-content-fn-2">Capstone Project 2 - Personal site</a></p><p>By the end of the course, if you have done the capstone projects, you will have a personal repository of projects to showcase on GitHub.</p></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/37331054#overview">Udemy Section 13</a></td><td>1</td><td>Around 1 hour for assignment</td></tr></tbody></table>
{% endtab %}

{% tab title="❗️Javascript, DOM" %}

<table><thead><tr><th width="259">Title</th><th width="168">Udemy Link</th><th width="139"># of Lectures</th><th>Duration</th></tr></thead><tbody><tr><td>❗️<strong>Introduction to Javascript ES6</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12371320#overview">Udemy Section 14</a></td><td>28</td><td>2 hr 28 min</td></tr><tr><td>❗️<strong>Intermediate Javascript</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12373892#overview">Udemy Section 15</a></td><td>19</td><td>1 hr 30 min</td></tr><tr><td>❗️<strong>The Document Object Model (DOM)</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12374106#overview">Udemy Section 16</a></td><td>9</td><td>56 min</td></tr><tr><td><a data-footnote-ref href="#user-content-fn-3">Boss Level Challenge 1 - The Dicee Game</a></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12383900#overview">Udemy Section 17</a></td><td>11</td><td>20 min (1-2 hours for assignment)</td></tr><tr><td>❗️<strong>The Unix Command Line</strong> </td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12371166#overview">Udemy Section 21</a></td><td>5</td><td>30 min</td></tr></tbody></table>
{% endtab %}

{% tab title="❗️Git, GA" %}

<table><thead><tr><th width="231">Title</th><th width="188">Udemy Link</th><th># of Lectures</th><th>Duration</th></tr></thead><tbody><tr><td>❗️<strong>Git, GitHub and Version Control</strong></td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12386072#overview">Udemy Section 27</a></td><td>9</td><td>1 hr 17 min</td></tr><tr><td>❗️<a data-footnote-ref href="#user-content-fn-4"><strong>How to set up Google Analytics</strong></a> <strong>(GA)</strong></td><td><a href="https://www.youtube.com/watch?v=f3X-hYRxBL8">YouTube tutorial</a></td><td>-</td><td>6 min</td></tr></tbody></table>
{% endtab %}
{% endtabs %}

We highly recommend completing the additional courses below to have an understanding on full stack web development.

{% tabs %}
{% tab title="Backend" %}

<table><thead><tr><th width="252">Title</th><th width="174">Udemy Link</th><th width="138"># of Lectures</th><th>Duration</th></tr></thead><tbody><tr><td>Backend Web Development</td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12407820#overview">Udemy Section 22</a></td><td>2</td><td>21 min</td></tr><tr><td>Node.js</td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12384268#overview">Udemy Section 23</a></td><td>8</td><td>1 hr 6 min</td></tr><tr><td>Express.js with Node.js</td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12384462#overview">Udemy Section 24</a></td><td>8</td><td>2 hr 1 min</td></tr><tr><td>EJS (Embedded JavaScript)</td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/38911782#overview">Udemy Section 25</a></td><td>6</td><td>1 hr 30 min</td></tr></tbody></table>
{% endtab %}

{% tab title="APIs" %}

<table><thead><tr><th width="225">Title</th><th width="189">Udemy Link</th><th># of Lectures</th><th>Duration</th></tr></thead><tbody><tr><td>APIs (Application Programming Interface)</td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/38912006#overview">Udemy Section 28</a></td><td>8</td><td>2 hr 28 min</td></tr></tbody></table>

{% endtab %}

{% tab title="Databases (SQL + PostgreSQL)" %}

<table><thead><tr><th width="230">Title</th><th width="196">Udemy Link</th><th># of Lectures</th><th>Duration</th></tr></thead><tbody><tr><td>Databases </td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/40494138#overview">Udemy Section 31</a></td><td>2</td><td>22 min</td></tr><tr><td>SQL  </td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/12385674#overview">Udemy Section 32</a></td><td>6</td><td>36 min</td></tr><tr><td>PostgreSQL </td><td><a href="https://learncsc.udemy.com/course/the-complete-web-development-bootcamp/learn/lecture/40494144#overview">Udemy Section 33</a></td><td>16</td><td>4 hr 11 min</td></tr></tbody></table>
{% endtab %}
{% endtabs %}

[^1]: optional but useful

[^2]: optional but it will help you experiment with your first website

    (E.g. Steph’s first ever [website](https://stephsiow.github.io/cv/))

[^3]: optional but fun and useful for practice

[^4]: this will be used to analyse your webapp’s metrics e.g. user traffic


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://info.techup.live/programme-essentials/mandatory-course-udemy.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.