Giter VIP home page Giter VIP logo

flw2-u1l2-23-24-student-exercises's Introduction

Lesson 1.2: Variables & Conditionals

Welcome to the lesson on IDEs, Variables, and Conditionals! This README serves as a reference tool to review key points and includes code snippets to help reinforce learning.

Table of Contents:


CodeSandbox Introduction

What is CodeSandbox?

  • Online editor tailored for rapid web development.
  • Quickly prototype, experiment, share, and debug your code.
  • Supports multi-page websites and various frameworks or libraries.
  • Collaborative coding enabled through live sharing.

Quick Start:

  1. Login: Go to CodeSandbox -> Sign In using GitHub.
  2. Creating a Sandbox:
    • Click Create -> Choose Vanilla from Official Templates.
    • Your new sandbox will load up with an index.html file ready to edit.
  3. Navigating: The left navigation panel provides access to various features such as:
    • Sandbox Info, Explorer, Search, Configuration Files, GitHub Integration, Deployment options, and Live collaboration.

Note: For detailed exploration of CodeSandbox, follow the teacher's guide provided in the lesson.


Variables in JavaScript

Variables are containers that store data values.

Declaring a Variable:

let box;

Assigning a Value to a Variable:

box = 10;
// or
let box = 10;

Re-assigning Value:

box = 15;  // Now, box has a value of 15

Note: Variable names should be descriptive, can't start with a number, and can't use JS keywords.


Technical Questions

  • Contextualize your question: explain what you're trying to achieve.
  • Specify the problem and indicate any solutions you've already tried.
  • Sharing your code can often help in resolving the issue faster.

Example: Instead of saying "My code doesn't work", you might say: "I'm trying to fetch user data from an API using JavaScript, but I'm getting a 404 error. I've checked the endpoint URL, and it seems correct. Can someone take a look at my fetch function?"


JavaScript Math

Basic arithmetic works intuitively:

5 + 2  // 7
5 * 2  // 10
5 - 2  // 3
5 / 2  // 2.5

Example with Variables:

let myNumber = 12;
myNumber / 3  // 4

Conditionals in JavaScript

Conditionals allow you to execute different code branches based on conditions.

Basic if Statement:

if (myNum === 8) {
    console.log("8 is great!");
}

if-else Statement:

if (myNum === 8) {
    console.log("8 is great!");
} else {
    console.log("That number is OK.");
}

if-else if-else Statement:

if (myNum === 8) {
    console.log("8 is great!");
} else if (myNum < 10) {
    console.log("Wow. Less than 10?");
} else {
    console.log("That number is OK.");
}

Happy coding!

flw2-u1l2-23-24-student-exercises's People

Contributors

cn-curriculum avatar cn-mika avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.