In this first lesson, students will be introduced to React Native, a framework that will be used to develop apps throughout this course. They will also be guided through the download process for Expo, an app that helps students run their programs on their handheld devices as they are created.
Students will be able to:
In this lesson, students are introduced to the basic components used to build React Native apps. They will learn about the parent view component and see how all child components are nested inside.
Students will be able to:
In this lesson, students learn how to add styling to specific components to their apps using the Stylesheet API.
Students will be able to:
In this lesson, students will begin to style their app layout using various Stylesheet components.
Students will be able to:
In this lesson, students will learn about the text attributes that can be styled.
Students will be able to:
In this lesson, students will begin creating their Scorekeeper program. They will be able to design it how they wish and will be adding to this program throughout the course as they learn new concepts.
Students will be able to:
In this lesson, students review content with a 15 question End-of-Unit Quiz.
Students will be able to:
In this lesson, students will learn how to make components of their apps react to being pressed.
Students will be able to:
In this lesson, students will learn how to use the TextInput component to allow users to input information into their apps.
Students will be able to:
In this lesson, students will add some functionality to their Scorekeeper program. They will allow users to enter team names as well as fire alerts when certain buttons are pressed.
Students will be able to:
In this lesson, students review content with a 15 question End-of-Unit Quiz.
Students will be able to:
In this lesson, students will learn how to add images to their apps.
Students will be able to:
In this lesson, students will learn how to use the ImageBackground
component to allow other components to be placed on top of an image.
Students will be able to:
ImageBackground
components to layer various components on top of an imageIn this lesson, students will learn how the Image
component can be nested inside a TouchableHighlight
component in order to use images as buttons.
Students will be able to:
Image
components as buttons in their appsIn this lesson, students will learn how to create responsive layouts using flex values.
Students will be able to:
In this lesson, students will learn how to create responsive layouts using the Dimensions API.
Students will be able to:
In this lesson, students will add images to their Scorekeeper apps. They will also alter the way their components are sized so that their layout is responsive.
Students will be able to:
In this lesson, students review content with a 15 question End-of-Unit Quiz.
Students will be able to:
In this lesson, students will spend time researching, exploring, planning, and developing a replica of an app screen they’ve used previously. They should try their best to mirror the features of the chosen screen and think about the functionality that should be built into the app in order to clearly determine which topics they still need to learn when it comes to app creation.
Students will be able to:
In this lesson, students will learn how to set state variables and use their values inside their programs.
Students will be able to:
In this lesson, students will learn how to update the values of states by using TouchableHighlight components.
Students will be able to:
In this lesson, students will learn how to set numerical state values and update them using mathematical equations.
Students will be able to:
In this lesson, students will learn how string methods can be used to update the value of string states.
Students will be able to:
In this lesson, students will add functionality to their app that will update the score of each team based on button presses.
Students will be able to:
In this lesson, students review content with a 15 question End-of-Unit Quiz.
Students will be able to:
In this lesson, students will learn how to create layouts that include navbars.
Students will be able to:
In this lesson, students will learn how to create apps that have multiple screens.
Students will be able to:
In this lesson, students will separate the contents of their Scorekeeper app onto multiple screens.
Students will be able to:
In this lesson, students review content with a 15 question End-of-Unit Quiz.
Students will be able to:
In this lesson, students will learn how they can use conditionals in their React Native apps.
Students will be able to:
In this lesson, students will learn how parameters can be used inside React Native functions.
Students will be able to:
In this lesson, students will add a new screen to their app where the record of each team’s wins, losses, and ties will be recorded. They will use their prior knowledge of creating multiple screens and the new concepts of conditionals to complete this task.
Students will be able to:
In this lesson, students review content with a 15 question End-of-Unit Quiz.
Students will be able to:
In this lesson, students will spend time researching, exploring, planning, and developing an app that converts between multiple currencies.
Students will be able to:
In this lesson, students review content with a midterm exam.
Students will be able to:
Have you ever wondered how web pages are made? In this lesson students will be introduced to HTML: the language for building web pages. Students learn about why HTML is important, how it works, and start building their very own web pages.
Students will be able to:
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
In this lesson, students upgrade from simple tags to full HTML documents. Students learn new tags that let them put information in different places on the web page, and about the nested tree structure of an HTML document.
Students will be able to:
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
The web pages students have been building have been awesome, but they’d be even better with some style. In this lesson students learn about formatting tags that let them modify the appearance of text and make their web pages look clear and aesthetically pleasing.
Students will be able to:
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
Have you ever clicked on text on a webpage and it took you to a different web page? One of the most important features of a web page is that they can be linked together! In this lesson students learn how to add hyperlinks to their web pages using the <a>
tag.
Students will be able to:
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
Almost all web pages on the Internet have images. In this lesson, students learn how to add images to their own web pages using the <img>
tag!
Students will be able to:
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
Students see lists all the time on web pages. They are a fun and easy way to display information to the reader. In this lesson students learn how to add lists to their web pages, and practice making different kinds of lists.
Students will be able to:
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
In addition to lists, tables are a very commonly used way to display information on web pages. In this lesson students learn how to make their own tables on their web pages!
Students will be able to:
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
Now that students know how to use HTML, they need to learn how to build expressive web pages. Students can use HTML Styling to make their pages visually appealing and unique.
Students will be able to:
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
In this lesson, students will dissect how colors are represented on a webpage. They will learn about how red, green, and blue are mixed to create colors, and how the levels of red, green, and blue are specified using rgb values and hex values.
Students will be able to:
In this lesson, students will begin using CSS to add styling to their HTML pages.
Students will be able to describe how CSS adds styling to HTML pages.
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
In this lesson, we learn CSS superpowers. We can use CSS tag selectors to select all elements of the same kind (<table>
, or <h1>
for example) and give them all the same style.
Students will be able to use CSS tag selectors to select all elements of the same kind and give them all the same style.
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
In this lesson, we learn to use CSS Class selectors to apply CSS styling to all HTML elements that share a specified class. This allows us to be more specific when applying our styling.
Students will be able to use CSS Class selectors to apply CSS styling to all HTML units that share a specified class.
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
CSS Selectors by ID help us select a single element to format on our page. This is helpful when we need to be as specific as possible in applying our CSS rules.
Students will be able to use CSS Selectors by ID to select a single element to format on a webpage.
This lesson builds toward the following Enduring Understandings (EUs) and Learning Objectives (LOs). Students should understand that…
In this lesson, students will learn how CSS rules are applied when more than one rule applies to an element.
Students will be able to …
Variables are like a box that can hold values. The steps to using variables are to first define it to a certain type such as Boolean, string, or integer and using suggested naming conventions. Secondly, variables must be initialized to a start value, and to assign it to a variable type.
Students will be able to…
* Explain what variables are and what they are used for
* Create their own variables
* Print out the values stored in variables
Booleans refer to a value that is either true or false. Named after English-born mathematician, philosopher and logician, George Boole, Booleans are used to test whether a condition is true or false.
Students will be able to…
* Create boolean variables to represent meaningful yes/no values
* Print out the value of a boolean variable
Logical operators allow us to connect or modify Boolean expressions. Three logical operators are the !, ||, && characters.
* ! = NOT
* || = OR
* && = AND
Logical operators can be used in combination.
With these logical operators, we can construct logical statements such as “I go to sleep when I am tired OR it’s after 9pm”, “I wear flip flops when I am outside AND it is NOT raining”
Students will be able to…
* Describe the meaning and usage of each logical operator: OR (||), AND (&&), and NOT (!)
* Construct logical statements using boolean variables and logical operators
Comparison operators let us compare two values. Using comparison operators in programming is similar to math in that less than <
, greater than >
, less than or equal to <=
, and greater than or equal to >=
are the same. The differences are that operators for equal to are ==
and not equal are !=
. Using comparison operators allows our program to make decisions.
Students will be able to…
* Explain the meaning of each of the comparison operators (<, <=, >, >=, ==, !=)
* Create programs using the comparison operators to compare values
* Predict the boolean result of comparing two values
* Print out the boolean result of comparing values
JavaScript uses if statements as a way to make decisions and execute specific code. If statements are helpful in writing code that can be used in different situations.
Students will be able to…
* Explain the purpose of if statements
* Create their own if statements to selective choose which code is executed in their programs
Students begin the Designing User Interface module by taking a look at various UIs and defining the aspects as ‘good’ or ‘bad’. They then begin to brainstorm an idea for their group app creation.
Students will be able to:
Students learn how to design for accessibility in order to create apps that can be used by a wide audience. They will learn the best practices when performing interviews and will have a chance to put them into practice.
Students will be able to:
Students use their knowledge of accessibility and interviewing techniques to create a composite character profile which will lead to a point-of-view statement that will define their app’s purpose.
Students will be able to:
Students will learn how to have a successful group brainstorming session. They will learn some specific guidelines that help to create a successful session and will put them to practice in a session with their classmates.
Students will be able to:
In this lesson, students will be introduced to prototyping. They will be given guidelines for this step and shown examples in order to successfully create prototypes of their group’s project ideas.
Students will be able to:
Students will learn how to successfully test their prototype with a user. They will get useful feedback on both of their initial prototype designs and will use this information to create a final prototype that will then be programmed using React Native.
Students will be able to:
In this lesson, students review content with a 10 question End-of-Unit Quiz.
Students will be able to:
In a group, students will create a functioning and stylized app based on their prototype created in the previous module.
Students will be able to:
Sign up for a free teacher account to get access to curriculum, teacher tools and teacher resources.
Teacher SignupSign up as a student if you are in a school and have a class code given to you by your teacher.
Student Signup