[toc]
JavaScript is a programming language that has many different applications. Programmers can use JavaScript to make websites, visualize data, and even create art!
The main reason for learning JavaScript is that it has become a key language for web development. Understanding how the Internet works and being about to create web applications are important skills in today's landscape. With JavaScript, you can work on your own web applications and support current applications for a company.
Another reason is that JavaScript is very much like other programming languages.
Throughout the course and your career, you will hear that once you learn one programming language, it is easier to learn another. Programmers have found this to be true, especially if an new language closely matches the first.
A blended learning model incorporates in-class learning with online materials such as the online textbook I am getting some of these notes from.
Course activities are designed to make the most of your in-class and out-of-class time.
It is important to actively engage in each activity. Skipping the prep work or falling behind on assignments can quickly lead to struggling in the class! 😱
🧙♂️ It's dangerous to go alone! Make some friends and work together! Working alone sucks! Find some friends and work together on assignments!
Prep Work is done before each class session and covers the topics that you will learn about that day. In addition to reading, prep work includes small questions that can help you reinforce your understanding of what you just read.
Studying the materials before class helps students make the most of their short in-class time! SO READ UP!
♿ ACCESSIBLITY FEATURE! Want your browser to read you stuff? You can do a few things:
Exercises
ℹ️ NOTE: I added some emojis to my version of the outline. Just about every Exercise section has a running man 🏃 icon indicating where they may be exercises. Not all sections may have them, but many of them do.
In class you will meet fellow students on the same learning journey as you. You should engage, interact, and encourage each other through the class.
In class, there will also be an instructor and teaching assistants (TAs).
During large group time (LGT), the entire class participates in the lesson, led by the instructor. The lesson is not a substitute for doing the prep work before class. It's a time used to review examples as a group and shore up concepts from the prep work.
After the large group time, the class is broken into small groups, each lead by a TA. During small group time (SGT), each group does an in-class coding activity called a studio 🎙️. This time is equally as important as LGT because it is time for individual support and a place where you can feel comfortable talking openly about concepts you need help with.
ℹ️ NOTE: Studios in the outline will have a studio microphone emoji 🎙️. There wasn't a studio emoji so this was close enough.
Assignments are large projects where you demonstrate what you have learned and challenge yourself. Assignments oftentimes cover multiple lessons.
⚠️ WARNING: Big Brother is watching! 👀 To prevent the class room from turning into a house of lies, Canvas will check if you read your required reading. So read the prep work and brush your teeth!
LaunchCode monitors your progress in the class through a management system called Canvas. It provides a central location to manage the flow of information, but it does not hold the actual course content. Instead, it links to the lessons you need, and it keeps a record of your completed assignments and scores.
Access Canvas and the course assignments at https://learn.launchcode.org/. Login with your LaunchCode username and password.
The dashboard displays the LaunchCode courses you can access, due dates, and several menu items. You'll see this after you login.
Clicking on a course title takes you to that class's homepage which displays upcoming due dates, announcement, general information, and menu items. The options you will likely most use will be the Syllabus and Assignments.
The Syllabus page provides the general information such as the class description, the time line for the course, and a class calendar and To Do list. Scrolling down the page shows the Course Summary, which holds links to the individual tasks (reading, quizzes, assignments, etc.)
The Assignments page sorts the required tasks by date or type. A few days before each class session, new tasks will be added to the list. Old content remains active, allowing you to use the links for reference and review.
Clicking on a specific title brings up information about that task, including the due date, points possible, instructions, and links.
While much of the course content is accessible without login, the best choice is to begin from within Canvas so that your progress is recorded and your scores will update as soon as you complete quizzes.
Submitting files for the larger assignments should only be done through Canvas.
Repl.it is a free online code editor, and provides a practice space to boost your programming skills.
We will use it in this class for tow purposes:
- To provide opportunities to respond to prompts, questions, and "Try It" 🧩 exercises embedded within the reading. (These tasks are not tracked or scored.)
- To hold larger exercises and studios that will be checked for accuracy and tracked for completion.
ℹ️ NOTE: Repl.it account creation is covered in Chapter 2.
Logging into Repl.it allows students to complete the general practice tasks.
To access the tracked and scored tasks, students must also enroll in a Repl.it classroom. A link to join the classroom will be provided as part of an early Canvas assignment.
Standard repl.it is an online code editor for various languages. Coders collaborate by sharing repl.it URLs.
Standard repl.it is used for:
- Publicly sharing code examples and starter code.
- A place to practice new concepts by writing and running code.
💲 I can answer that...for money. Repl.it offers some other projected hosting service as part of a paid account, but we won't be over that in this course.
Repl.it Classroom provides online code editing and submission. It also allow teachers to post instructions and establish automatic code evaluation.
⚠️ CAUTION: Picky evaluation programs! For some reason, the evaluation program may dock points if things are exactly right. So pay attention to text and features. If you feel like something was scored wrong, ask an instructor. They could pardon a frivolous error (i.e. not adding an exclamation point at the end of "Hello World!") or if you can redo that part of the assignment, correct your error and resubmit it.
Assignments in a classroom can be kept private from people who are not enrolled, and grades can only be viewed by designated instructors.
Repl.it Classroom is used for:
- Completing then submitting exercises 🏃 and receiving feedback.
- Completing then submitting studios 🎙️ and assignments for a grade.
- Keeping student submissions visible only to the teachers in the repl.it classroom.
ℹ️ NOTE: You will never have to click
Savewhen using standard Repl.it or Repl.it Classroom. Repl.it automatically saves your code on their servers. However, in Repl.it Classroom, you do have to clickSubmitto turn in your work.
❌ CENSORED! I didnt' realize it until about chapter 4, but I think exercises and studios are assignement. And I don't feel like writing them down in these notes. DO THE HOMEWORK!
There are several features to note in the Repl.it Classroom Workspace:
-
Settingsmenu: Allows you to change the editor settings like theme and font size. This is a hamburger menu in the header of the editor panel on the left side. -
Runbutton: Runs code in the editor panel. This button is located in the center of the editor panel on the left side. -
Name of the assignment: This should be located in the center of the main header on the top of the page.
-
Repl.it user menu: On the right side of the main header there are three links:
-
My Repls take you to your page that lists the work you have done.
-
Teacher which allows you to get in touch with the teacher. (:reminder_ribbon: TODO: Citation Needed! )
-
The user menu which shows your user name and allows you to change account details and your password.
-
-
Submit button: Located in the header of the Instructions panel, this button does three things.
- Allows you to submit your work.
- If the assignment is set up to be auto-graded, you will receive instant feedback.
- If the assignment is not set up to be auto-graded, your TA will need to review and provide feedback.
-
Instructions: Normally the right hand side is reserved for the console output, but in Rep.it Classroom, it's where the instructions for the assignment are. READ THEM CAREFULLY!
-
Editor panel: The editor panel is on the left side, like a standard Repl.it, but because the right hand side is the Instruction panel that means it shares space with the final feature.
-
Console output: Normally on the right-hand side, Console output has been moved to the footer of the left-hand side. After clicking the
Runbutton, output and errors will appear here.
ℹ️ NOTE: Results form work submitted in Repl.it Classroom appear in Canvas after being verified.
Remember, Canvas holds student grades and quizzes, but NOT the course content. It will provide links to the reading and other assignments.
Many sections end with a "Check Your Understanding ✅". This section is full of questions for you to double check that you understand the concepts in the reading. While your score in these sections will now count towards your final grad in the class, you should use them to help evaluate you understanding of the main concepts.
ℹ️ NOTE: A white check mark in a green box emoji ✅ is used to indicate a Check Your Understanding section. This is a feature that I added.
Examples are instances where a concept we just learned is tied into a potential real-world application.
The "Try It" 🧩 label signals an example that includes code you can modify and augment to quickly reinforce what you just read. Fiddle around with these!
ℹ️ NOTE: "Try It"s will have a puzzle piece emoji 🧩 next to them.
Man examples have links to Repl.it. As you explore the prepared examples in this book, feel free to make changes to the code. If you want to save your edits, click the Fork button at the top of the workspace and Repl.it will store a copy of the code in your personal account.
ℹ️ NOTE: Repl.it will automatically fork the example if you start modifying an example. Take care how ever that you could lose something at first while it makes that fork. It may be better to click on the
Forkbutton before you make any changes.
Once in a while, you will find a link to a "Booster Rocket 🚀". Booster rockets are not required reading, but can boost your learning.
ℹ️ NOTE: I added rocket emojis 🚀 to these sections. Most of them are called "Bonus Missions". I guess this means they are extra credit. YMMV.
LaunchCode's approach is different from other ways you can learn JavaScript. The textbook focuses on programming fundamentals which are problem-solving and transferable concepts. While the book will cover the exact way to perform certain tasks in JavaScript, it is important to remember that these tasks are relatively common and many programming languages have ways to carry them out.
🏁 That's it for the first chapter! Up next: How Programs Work.
#LaunchCode