camer0nluo / bit-camp-learning-lab-test Goto Github PK

Prerequisite: Fundamentals of JavaScript(This should be done already! Read the bottom of the doc to continue)

Welcome to Bit Camp, where students get hands-on experience with software engineering. Before the program starts, please find some time to complete the following assignment: learn/review JavaScript fundamentals that will later be used in the program. To complete this assignment, you will be creating a digital clock using JavaScript to demonstrate your skills! If you need any help, refer to these resources:

W3Schools: https://www.w3schools.com/js/default.asp

Tutorialspoint: https://www.tutorialspoint.com/javascript/javascript_overview.htm

Modern JS: https://javascript.info/

If you have specific questions, try out Stack Overflow (it is super duper helpful):

Stack Overflow: https://stackoverflow.com/

After you have learned/refreshed your knowledge of JavaScript, let's get started on making that clock. Here is the list of the requirements and some extensions you can complete if you have extra time!

Requirements:

• Display 12/24 HR time with hours, minutes, and seconds.
• Must be created using JavaScript (plus appropriate HTML and CSS for formatting and styling)

Extensions:

• Turn your clock from digital to analog mode (hint: you're gonna need a lot of CSS for this...)
• Use CSS to style your clock (ie: make it blue, green, yellow, etc)
• Create animations for your clock (ie. when the minute hand changes, it rotates/spins)

Don't know where to get started? Start off by creating a new function that starts your clock:

function startTime() {}

After this, you will need to create three variables:

var hr = " ";
var min = " ";
var sec = " ";

Also, make sure to reference the HTML you created the "clock" id in:

document.getElementById("clock").innerHTML = " ";

Good job, hopefully your digital clock is fully working and your jQuery is linked to our HTML and CSS files. Your next task is a bit more tricky... you're making another clock but this time... in analog mode!

If you have any other questions or need further assistance, feel free to reach out to your TAs!

To continue, press the close issue bottom at the bottom of the page!

Downloading an IDE

For this assignment, you will follow the instructions and complete a task showing your knowledge of the subject at the end. If at any moment you need help, feel free to contact your TAs.

Visual Studio Code

Before we start coding, we need to install an IDE. An IDE is a software application that provides comprehensive facilities to computer programmers for software development. An IDE normally consists of at least a source code editor, build automation tools, and a debugger. Although there are hundreds of IDEs to choose from, we are going to use Visual Studio Code due to its popularity and integration with Azure (via extensions and libraries).

To install VSC, go to: https://code.visualstudio.com/download and choose your operating system (ie. Windows, Mac, Linux, etc). Then click Download and run the installer (usually a .exe or .zip). After it's installed, open it up and try it out. If you need some help navigating VSC, check out this super helpful Youtube video.

Make sure to use Dark Theme unless you want to live life on the edge...

Task 1: create a JavaScript file that prints out "Hello World" in the terminal.

Once you are done, write a comment describing what you completed.