Code Camp – Day 1

Introduction

Welcome to the Virtual Code Camp (VCC) – an exciting and interactive coding adventure! In this camp, we will embark on a journey to explore the fundamentals of programming all the way up to object-oriented programming, using the versatile JavaScript language with the powerful p5.js library.

During this camp, you will dive into the fascinating world of coding, where you will learn the essential building blocks of programming and gain the skills to bring your creative ideas to life. Whether you’re a beginner or have some programming experience, this camp is designed to cater to learners of all levels.

Throughout the camp, we will focus on JavaScript as our programming language of choice. JavaScript is widely used in web development and has become an essential language for creating dynamic and interactive websites. By mastering JavaScript, you’ll gain a valuable skillset that can open doors to various career paths in software development, web design, and more.

To enhance our coding experience, we will be leveraging the p5.js library. P5.js is a fantastic tool that simplifies the process of creating visually appealing and interactive graphics, animations, and creative coding projects directly in the web browser. With p5.js, you’ll be able to experiment, express your creativity, and build exciting projects without getting bogged down in the complexities of web programming.

Throughout the camp, you’ll explore key programming concepts such as variables, loops, conditionals, functions, arrays, and more. You’ll learn how to use these fundamental building blocks to solve problems and create engaging projects. We’ll also delve into more advanced topics, including object-oriented programming (OOP), which will enable you to design and build modular, reusable code.

Our camp is structured to be interactive and hands-on. You’ll have the opportunity to work on coding exercises, projects, and challenges to reinforce your learning and put your skills into practice. Additionally, we encourage collaboration and learning from one another, fostering a supportive and engaging learning environment.

Our experienced instructors and mentors are here to guide you every step of the way. They’ll provide clear explanations, answer your questions, and offer valuable insights to help you develop your coding abilities.

So, get ready to embark on this virtual coding adventure at the Virtual Code Camp (VCC)! Together, we’ll explore the exciting world of programming, learn the foundations of JavaScript, harness the creative potential of p5.js, and develop the skills to create your very own interactive and visually stunning projects. Let’s unlock your coding potential and embark on an unforgettable journey of learning and discovery!

Objectives

  • Become familiar with p5.js and the p5js.org editor
  • Make an account at p5js.org.
  • Become familiar with the createCanvas() function.
  • Become familiar with setup() & draw() functions.
  • Demonstrate the ability to name and save files.
  • Become familiar with the p5.js reference.

Agenda

  • Meet & Greet
  • Getting Started
  • p5js.org Registration
  • Survey
  • Welcome
  • Introduction to p5.js & JavaScript
  • Make an account at p5js.org
  • The p5js.org Editor
  • createCanvas()
  • setup() & draw()
  • Auto-refresh
  • Menu Options
  • Naming your File
  • The p5.js Reference

Assets

Slides

Code Camp Day 1 Slides

Survey Questions

Each of these questions is presented to students who are given the following response choices:

__Strongly Agree
__Agree
__Undecided
__Disagree
__Strongly Disagree

  • I will likely pursue a STEM (i.e. Science, Technology, Engineering, and Math) related career.
  • I understand how to develop an algorithm for a computer program.
  • I am confident that I can complete coding tasks given to me.
  • I am confident that I can communicate with others to solve problems.
  • Even when coding camp is tough, I can perform quite well.
  • I understand the differences of various data types and what bits and bytes are.
  • I am confident I can debug a code (when it does not work) to find errors.
  • When difficult problems are given to me, I am confident that I will be able to understand them.
  • I am confident that I would enjoy working with computers.
  • I am able to learn tasks to work with computers for a job that may become available to me in the future.
  • I can understand code written by someone else.
  • I am confident that I will be able to learn code to solve problems.
  • I understand how various programming constructs (e.g. loop, condition) work in a program (i.e. code).
  • I understand how a computer works.

“Concept Survey”

The “concept survey” is actually a quiz. We introduce these by letting the students know that we are trying to evaluate our own effectiveness, and not their intelligence or understanding.

Review Video

Here is a link to ALL VIDEOS in the code camp series.

Tiger Code Camp – Video 0 This video is an introduction to the online ep5.js editor.

0:00 Introduction
0:30 Make an account at p5js.org
1:40 The p5js.org Editor
3:11 createCanvas()
4:10 setup() & draw()
5:05 Auto-refresh
5:55 Menu Options
7:00 Naming your File
8:44 The p5.js Reference