A Quick Overview of Skillcrush 102: Intro to JavaScript

Sarah Dye - Jan 12 - - Dev Community

Today's post is the beginning of a brand-new series. This series is based on Skillcrush 102, Skillcrush's JavaScript course. This course is designed to introduce students to JavaScript and jQuery.

Students learn how to apply these skills on websites as well as how to think like a computer. Skillcrush 102 has a different setup and feel than the other courses I've featured so far. The structure of this course has students learning about computational thinking and planning the logic for their two main projects in the course.

The next phase is replacing the logic with code and learning about JavaScript concepts. Finally, students learn how to connect JavaScript with HTML & CSS code so it works on a website. This course also includes a bonus project at the end to help students practice coding with JavaScript and have an extra project for their portfolios.

This post is a review of the first lesson in Skillcrush 102. This lesson is an overview of the entire course and outlines what the students will be learning. Students won't be writing any code in this lesson.

This lesson is meant to prepare students for what challenges they might face working with JavaScript and what they need to remember when things get tough. Today's post is sharing 6 things Skillcrush tells students to keep in these moments throughout Skillcrush 102.

Learning JavaScript isn't easy.

Before Skillcrush dives into the first lesson, they are honest with their students. JavaScript is going to be a challenge. Students will struggle throughout this course and encounter moments where they don't understand what is happening with their code.

When this happens, remember you are not alone. JavaScript is a tough programming language to learn. It can be even tougher if this is the first programming language you are trying to learn.

JavaScript was my first programming language and I found it tough to learn.

After learning HTML & CSS, I felt very confident going into Skillcrush 102. JavaScript was a big wake-up call for me. I felt lost throughout most of Skillcrush 102 and often worried if I was going to be a good developer as I worked my way through the course.

It has taken lots of time and practice, but now I feel much more comfortable working with JavaScript and understand how it works. As I've learned how to code, I discovered other developers have similar experiences working with JavaScript. During the Code Newbie chats, developers bond over their struggles learning JavaScript.

As soon as JavaScript was mentioned, others would begin sharing how tough JavaScript was to learn. Then there are the coding memes. Just google JavaScript memes and you'll find plenty of memes that capture how developers can feel when working with JavaScript.

JavaScript can sound scary right now.

It sounds like it will be extremely hard. Yet it is something that will become easier over time as long as you stick with it. Before Skillcrush begins explaining what JavaScript is, the first they do is ask their students to commit to the process and stick with JavaScript no matter what.

Consistency is the key to learning any programming language. All developers can learn how to code as long as they put in the time and hard work. Learning JavaScript was very tough for me.

It was my first programming language so it took time to adjust to it. Initially, I didn't want to work with JavaScript and would avoid using it since I wasn't confident using it. I realized that the only way to become better with JavaScript was to work with it.

So I made myself work with JavaScript a little bit each day. This means reviewing tutorials and working on JavaScript exercises. At first, I wasn't sure if it was working.

Yet gradually I realized I was making progress as I read my code and understood what was happening when I would test my code. Today I've become much more comfortable working with JavaScript. Once I felt better understanding JavaScript code, I faced the challenge of adding JavaScript code to my site. When I was doing the coding challenges, I set personal goals for myself to add some JavaScript to the sites I was building in some way.

Skillcrush 102 is going to be a tough course.

JavaScript is a skill anyone can learn as long as you ask questions and practice. Skillcrush also reminds students to be kind to themselves as they work with JavaScript. This means taking a break when they get stuck and walking away from their code.

Skillcrush instructors admit doing this as well as other developers currently working in tech. Many developers use this technique when they are stuck since it helps clear their minds a little bit before they try again. Learning to code is often illustrated as an S curve instead of a linear path.

This is because learning a new skill is going to have lots of ups and downs. There will be times when everything makes sense and you will know what you are doing. Then there will be times when nothing makes sense and you won't understand anything that is going on.

This is a common state developers are often and you will find yourself moving in between these two states often. Skillcrush encourages their students to put their faith and trust in the learning process. This doesn't just mean believing everything they will learn will work out and will fit into place.

Instead, this means being comfortable not knowing everything and being confused. Students are comfortable asking for help when they get stuck to find the solution they are looking for. Skillcrush encourages students to think of themselves as kids in their programming years. As one continues, they will eventually grow out of the kid phase.

There are six secrets to learning JavaScript.

The last thing students do in the course is make a commitment to themselves of things they will do as they work throughout the course and work with JavaScript. Students read through these commitments and submitted a selfie to agree to this commitment. In this post, you can comment "Yes I agree" in the comments below.

As you continue programming, these items are good things all developers need to remember when things get tough. Below are the six items in the Skillcrush 102 commitment students agree to do as they learn JavaScript.

  1. Be patient with yourself.
  2. Maintain a good attitude.
  3. Stick with programming no matter what.
  4. Complete all the lesson challenges and projects no matter how difficult they can be.
  5. Help other students overcome the same struggles you faced during the course.
  6. Get help from online communities and a mentor with any concerns and questions.

Skillcrush 102 will be different from previous Skillcrush courses.

Skillcrush 102 is structured into three different phases. The first phase of the course is designed to help students think like a developer. The lessons in this phase review important computer science concepts and show students how to solve programming problems.

You wouldn't be writing any code in this phase. Instead, you will be planning out the logic for the two big projects you'll be building in the course. One is a LOL Cat Clock while the other is an interactive magic 8 ball.

The second phase is where you'll begin writing JavaScript code. Students translate the logic they wrote in the first phase of the course into code as they build their projects. As you build these projects, be prepared to write more steps for simple tasks.

For example, here's a pen I created. When I click the button, the background of the entire web page will change from white to pink. This might sound like a simple task with just a couple of steps.

However, the JavaScript code shows that there are more steps just to get the button to change the background color. Below are the steps my code is taking to change the web page's background color to pink.

  1. Create a button in HTML.
  2. Connecting the button in HTML to JavaScript.
  3. Writing a function to change the color.
  4. Tell the computer to run the function when the user clicks the button.

The last phase of the course is all about the bonus project. The bonus project is an interactive election map. It is designed to help students get more practice writing JavaScript code and apply everything they have been learning in this course.

The goal of this course isn't to memorize all the JavaScript code that appears in this course. Reading code is just as important as writing code. Reading and writing code help developers become familiar with JavaScript so you can become comfortable looking at JavaScript code. Skillcrush designed this course in a way to help you train your eye when working with JavaScript code.

It is time to introduce JavaScript!

JavaScript is one of the oldest and most popular programming languages developers can learn. JavaScript is what brings elements to life and makes them interactive. Some of the things that rely on JavaScript to work are slideshows, alerts, and animations.

Below are some JavaScript code Skillcrush shares with students in Skillcrush 102. This code is meant to help Skillcrush students get their feet wet with JavaScript and begin training their eyes to read JavaScript code. So take a look at these lines of code below and see how JavaScript code might look on a website and how it might work.

1.This code gets an id to better show a modal on a website.

var modalButton = document.getElementById("my-button");
Enter fullscreen mode Exit fullscreen mode

2.This code assigns a function to be called when a button is clicked.

modalButton.onclick = showModal;
Enter fullscreen mode Exit fullscreen mode

3.This code gets a button to hide a modal on a web page.

var closeModal = document.getElementById('close-modal');
Enter fullscreen mode Exit fullscreen mode

4.This code assigns a function to be called when a button is clicked.

closeModal.onclick = hideModal;
Enter fullscreen mode Exit fullscreen mode

5.This code shows the modal on a web page.

function showModal() {
    var modal = document.getElementById("my-modal");
    modal.style.display = "block";
}
Enter fullscreen mode Exit fullscreen mode

6.This code hides a modal on a web page.

function hideModal() {
    var modal = document.getElementById("my modal");
    modal.style.display = "none";
}
Enter fullscreen mode Exit fullscreen mode

Conclusion

This is just a taste of everything you'll be learning in Skillcrush 102. This lesson might have been an overview of the course and how the three phases of the course will work, but it does share six important strategies developers can use to help them learn JavaScript. The next post in this series will officially be the start of phase one of Skillcrush 102.

This lesson will review computational thinking. I'll explain what computational thinking is and the 4 key principles you need to know so you can start thinking like a computer.

This post was originally published on September 10, 2020 on the blog BritishPandaChick Codes. I made minor changes to the original post to work here on CodeNewbie.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .