Sarah DyeWe’re officially ready to start writing pseudocode. Lesson five of Skillcrush 102 is all about pseudocode. This lesson doesn’t just have students writing pseudocode for their projects.
It takes time to explain what it is and why it is so important to developers. By the end of the lesson, students can translate the logic they created in the last lesson into pseudocode. Today’s post isn’t just an official review of Skillcrush 102’s pseudocode lesson.
This post is going to walk you through the challenge exercises students do in this lesson. We’ll be making a brand new flowchart before we translate all the logic into pseudocode. By the end of the post, you will have an updated flowchart with all your pseudocode for the LOL Cat project written in a document ready for phase two of this course.
A quick author’s note about Skillcrush 102 posts!
As I continue to write posts for the Skillcrush 102 series, I’ve decided to include examples from the lessons to explain how you should interpret these items. I’ve also included all the challenge exercises Skillcrush provides to help you practice what you are learning before you do it with the Skillcrush projects you’ll be building in this course. I found that including all of these elements in these posts has made them very long.
So I’ve decided to split the content for all these lessons. The Skillcrush 102 series will continue to feature Skillcrush lessons, but Skillcrush 102 Challenges will be a series just for the lesson challenges. I will include links to all the challenges in this post so you can just click the link to check out how to approach the challenge exercises.
So what is pseudocode?
You might have noticed in the past few lessons we have been writing all the directions out in a language we understand. Now it is time to translate the directions we’ve written into a language the computer understands. Skillcrush reminds students that computers are simple.
This means they won’t be able to understand the language we are using to communicate. This is where pseudocode comes in. Pseudocode is a way of breaking down the instructions so they appear more like code.
Pseudocode won’t work on a computer, but it will mirror certain aspects of code. Skillcrush encourages students to think of it as the middle ground in writing code and as another stepping stone to thinking like a programmer.
Pseudocode terms
Writing pseudocode can be confusing since there aren’t many rules developers need to follow and there’s no right way to do it. So developers can easily make pseudocode any way they want. However, Skillcrush has put together a few tips to help students write pseudocode and what are the keywords that commonly appear in pseudocode.
These keywords are going to seem familiar because we used these in our flowcharts and you will be using these keywords often as you write your pseudocode.
STOP/END
This keyword lets the computer know when a statement or instruction is finished. Think of it as the way a period works at the end of a sentence. When we want to end a paragraph, we use a period to finish the sentence.
Stop and end keywords function the same way. They are just more literal so computers can understand. You will be using stop and end in the if-else statements, but you will also use these keywords with functions and loops later in your pseudocode.
You can pick either stop or end to use in your code. The goal here is to tell the computer when a statement is done.
IF-THEN-ELSE
These keywords indicate when there is an if-then-else statement in your code.
IF time is known THEN
OUTPUT message: “Good day, mate!”
ELSE
OUTPUT message: “I’m not sure what time it is, Good day anyway!”
STOP
INPUT
This indicates where data is given to the computer. Think about users giving the computer information such as their names and e-mail addresses. You will see more of this when we write functions in future lessons.
OUTPUT
This will be the result developers want to accomplish. After doing a bunch of commands, the output is what users might see or what the computer can do.
INPUT time
IF time is known
IF time is before noon THEN
OUTPUT message; “Good morning!”
ELSE IF time is after evening THEN
OUTPUT message: “Good evening!”
ELSE
OUTPUT message: “Good afternoon!”
STOP
ELSE
OUTPUT “I’m not sure what time it is, Good day anyway!”
STOP
STORE
Developers use this keyword to tell the computer what needs to be saved or stored. For example, look at websites where they have an e-mail sign-up on their website. This form field has users inputting their names and e-mail.
Once a user does this, a message is shown to the user with their name on it. For this to work on websites, developers use the store keyword to indicate the name needs to be saved. Remember computers are straightforward so they don’t know when they need to store values.
So developers need to make it clear to the computer what information needs to be stored. If you want to store variables, your code would look like this.
INPUT name “Jane Doesitall”
STORE name
OUTPUT message: “Hello [name]! Welcome to our website!”
The store keyword isn’t just for storing variables. Developers can use this keyword to change certain values. For example, certain dresses are meant for a specific type of season. If a person wants to decide which dress is your favorite based on the season, here’s how you would approach the pseudocode.
STORE favorite dress
STORE season
IF season IS summer
Favorite dress IS blue dress with spaghetti straps
ELSE IF season IS fall
Favorite dress IS maroon dress with three-quarter sleeves
ELSE IF season IS winter
Favorite dress IS grey sweater dress
ELSE IF season IS spring
Favorite dress IS cap-sleeved purple dress
STOP
Indenting
One of the best practices you need to remember is indenting. When we write pseudocode, indenting is very important to do. It helps you read your pseudocode more clearly. Although it isn’t necessary, it is very helpful for both you and other people who will be reading your code.
Variables
Before you begin writing pseudocode, we need to talk about variables. Variables might sound familiar because you might have seen them in algebra when you were in school. When you were solving equations, you might have seen the following in a textbook.
x=y+8
If y = 2, solve for x
In this example, x is standing in for y + 8. The goal of this problem is to figure out what the number x is. The way the x works in this equation is similar to how variables work in programming.
Variables stand in for values, but the values will vary more than equations. Developers can use words and code as well as numbers for variables. Another great perk about variables in programming is that the value can change depending on where you are in the script.
So your project could start at one value and then become something completely different later on. There will be variables in the LOL Cat Clock. The time of day value will change constantly so it is a good candidate for a variable.
Using a variable for the time of day will keep the variable the same in the code while still allowing the value to change. So what would this look like in pseudocode? Here’s one version of the LOL Cat Clock pseudocode a developer might write for this project.
Example
If we want to indicate a variable in pseudocode, you can use the store keyword. In this example, the store keyword lets you know that it is the time variable that will store the value of the time a user comes to the site.
INPUT computer finds out what time it is
STORE time in the TIME variable
IF Time < 12pm
OUTPUT message: “Good morning!”
ELSE
OUTPUT message: “Good day!”
Challenge: Identifying Some Variables!
Challenge: Translate Some Text into Pseudocode!
How to translate text and flowcharts to pseudocode
You will find that the rest of phase one is going to be turning lots of logical statements and flowcharts into pseudocode. Skillcrush admits this is going to be tricky so they show students an example where a logical transformation turns into a flowchart then eventually pseudocode. This will be the process you will take to turn your LOL Cat clock project work into pseudocode.
Creating the instructions
Let’s look at the first example. Skillcrush provides students with the following scenario.
Leslie is on her way to work, and she reeeeally wants an almond milk latte. She’s also doesn’t have a whole lot of extra time, so she makes a plan: she’ll go by her favorite coffee shop, Joe’s, and if they’re too busy, then she’ll swing by her second favorite spot, Mighty Bean. If Mighty bean is too busy, then she’ll just have to suck it up and drink some coffee at the office.
First, let’s work on writing this scenario as instructions. Let’s start by setting up an if statement. For the if statement, the computer will need to check if Joe’s is busy.
If Joe’s isn’t busy, then Leslie will go get an almond milk latte. What if Joe’s is busy? In the scenario, Leslie will go to Mighty Bean next.
So we will write an else statement that says go to Mighty Bean. Once Leslie gets to Mighty Bean, she needs to check if it is busy so we will need another if statement. If Mighty Bean isn’t busy, then she will get an almond milk latte.
If it is busy, the computer will need another else statement that says to go to work and drink office coffee. Here’s a version of the finished instructions we just wrote. What matters in this step is getting the logic written in a way so the computer will be able to read and understand.
IF Joe's isn't too busy, THEN go on in and get an almond milk Latte.
ELSE go to Mighty Bean
IF Mighty Bean isn't too busy, THEN go on in and get an almond milk latte.
ELSE just go to work and drink some work coffee.
Text to Flowchart
Now that the instructions are written, we are going to create a flowchart. Here’s the flowchart version Skillcrush created for this scenario. Their example includes outputs to show the computer what will need to be displayed to users throughout each of the if-else statements.
Flowchart to Pseudocode
The last thing we need to do is write the pseudocode. This is where we take the flowchart we created so it looks like code. You will notice that the pseudocode is going to be very similar to the instructions we wrote earlier.
However, pseudocode differs since it is condensed and similar to code. It includes terms from the flowchart such as start and stop as well as the indentation to make sure everything looks as straight as possible. Here’s how Skillcrush wrote the pseudocode for this example.
START
IF Joe’s is not too busy THEN
Go to Joe’s
OUTPUT Get an almond milk latte from Joe’s!
ELSE IF Joe’s is too busy THEN
Go to Mighty Bean.
IF Mighty Bean isn’t too busy THEN
OUTPUT Get almond latte.
ELSE
Go to work
OUTPUT drink work coffee.
STOP
Remember it is 100% ok if your pseudocode looks different from this example. The guidelines Skillcrush recommends are there to help developers keep everything clear.
Adding variables!
Let’s try adding some variables to our pseudocode. Variables are always declared at the top of the pseudocode using the store keywords. It does seem odd declaring variables this way, but the way variables look now will change as you start writing JavaScript code.
Two items we can use as variables are the coffee shop and the beverage. The values will change depending on what stage we are at in this algorithm. To add variables into our pseudocode, we will add the store keyword for the coffeeshop and beverage before the start keyword.
You won’t assign a value to the coffeeshop variable. We will assign this variable until later when the instructions start going. For beverage, we will store the value as almond milk latte. This value will be used for most of the algorithm until the end.
STORE coffeeshop.
STORE beverage AS “almond milk latte”.
Now that we have added our variables, let’s go back into our code and incorporate them into our pseudocode. After the start keyword, you will put coffeeshop and set it to Joe’s. After the coffeshop variable, you can add our first if statement. Change Joe’s to coffeeshop.
START
coffeeshop = Joe’s
IF coffeeshop is not too busy THEN
Go to coffeeshop
OUTPUT Get a beverage from coffeeshop!
Now let’s update the else if statement. We can change Joe’s to coffeeshop. Now we need to change the variable value for coffeeshop to Mighty Bean for the actions in this statement.
After the then keyword, we can set the coffeeshop to Mighty Bean. Now that the variable is set to Mighty Bean, it will use this value every time it encounters Mighty Bean in the pseudocode.
ELSE IF coffeeshop is too busy THEN
coffeeshop = Mighty Bean
Go to coffeeshop.
IF coffeeshop isn’t too busy THEN
OUTPUT Get beverage.
The last thing we need to update is the else statement. This is where we will want to change the beverage variable to work coffee. We can do this by setting beverage value to work coffee after Go to work in the pseudocode.
ELSE
Go to work
Beverage = “work coffee.”
OUTPUT get beverage
STOP
Challenge: Translate a Flowchart into Pseudocode
Challenge: Make a new LOL Cat clock Flowchart
Challenge: Turn LOL Cat clock flowchart into pseudocode!
Conclusion
We accomplished quite a lot in today’s post! You learned about pseudocode and why it is important to write pseudocode as part of their project prep. You also got lots of practice writing pseudocode yourself by translating flowcharts into pseudocode and using common terms you will often see in pseudocode.
We are almost done with phase one of Skillcrush 102. The next lesson is all about objects and functions. This lesson reviews how objects and functions work in code. You will begin writing objects and functions as we begin preparing the Magic 8 Ball project, the second project in Skillcrush 102.
This post was originally published on June 7, 2021 on CodeNewbie. I made minor changes to the original post to work here on DEV.
