# :+1:

## Instructions

- Create a account on KhanAcademy
- Go to [https://www.khanacademy.org/join](https://www.khanacademy.org/join) and use the joining code: PDQVXV9Y,
- Wait a minute or so. We have assigned you some videos, challenges and a project.
- Watching videos is optional.
- Completing challenges is mandatory.
- There is one final project that you are supposed to start after completing the assigned challenges. Be creative. (A list of most creative projects will win these tiny five stars)
- Try going through discussion if you don't understand a concept shown in the video.
- Call for a volunteer / raise your hand if you are not able to understand a video or steps of a challenge.
- Read Project section before starting the project.

Starting link: https://www.khanacademy.org/computing/computer-programming/programming

## [Essential Course Flow](https://www.khanacademy.org/computing/computer-programming/programming)
**Watching more video and doing more challenges as per curiosity and necessity is recommended**

1. Intro to programming
1. [What is Programming? (2 min video)](https://www.khanacademy.org/computing/computer-programming/programming/intro-to-programming/v/programming-intro)
2. Article (1 min)
2. [Drawing basics](https://www.khanacademy.org/computing/computer-programming/programming/drawing-basics/p/making-drawings-with-code)
1. Making drawings with code (7 minutes)
2. Quick Tip: Number Scrubbing (1 min)
3. Challenege: Simple Snowman
3. [Coloring](https://www.khanacademy.org/computing/computer-programming/programming/coloring/p/coloring-with-code)
1. Coloring with Code (6 mins)
2. Quick Tip (1 min)
3. Challenge: Sunny snowy day
4. The Power of the Docs (6 mins video)
4. [Variables](https://www.khanacademy.org/computing/computer-programming/programming/variables/p/intro-to-variables)
1. Intro to Variables (4 mins)
2. Quiz: Variables (5 questions)
3. Challenge: Bucktooth Bunny
5. [Animation basics](https://www.khanacademy.org/computing/computer-programming/programming/animation-basics/a/what-are-animations)
1. What are animations? (doc)
2. Making animations (6mins)
3. Challenge: Exploding Sun
6. [Interactive Program](https://www.khanacademy.org/computing/computer-programming/programming/interactive-programs/p/mouse-interaction)
1. Mouse Interaction (3 mins)
2. Challenge: Tasty Tomato

7. [Project: Crazy Emoji](https://www.khanacademy.org/computer-programming/new/pjs)

## [The Project: Crazy Emoji](https://www.khanacademy.org/computer-programming/new/pjs)
**Must read before starting the project**

There are a lot more features in processing.js, and we don't cover all of them in our assigned items. You are recommended to explore the whole course on KhanAcademy. If you think you might need to know more about a topic x, go through the concerned items. This process is called a top-to-bottom learning model. While doing a project, you figure what you need to learn, and then you learn it. In the opposite bottom-to-top learning model, you usually learn everything you can, and then you start doing any project. In our developer's worlds, top-to-bottom rules. So remember the steps:
- Think about what you want to make. (Maybe use a pen and a paper here)
- Figure out what tools will be required to make it.
- Learn about the tools while you code away

Remember to click "I'm done" to submit the project.

#### Project requirements:

###### Must haves
- Make any emoji yourself using processing.js

###### Optional crazy/normal ideas (TODO add more cool stuffs)
- Make it as realistic as possible
- Make eyes pop out on mouse over?
- Make two emoji interact with each other.
- Your imagination(and time) is the limit.

## Why the hell are we doing this? (Optional read)

In real world programming, we often use specialized tools for our required tasks. For example: If we want to develop a web application, we are probably going to use a programming language like Python, Go, Ruby, maybe Java but not C or assembly. Even if we choose python for our web app, we will be using a library like Flask or Django. Another example: If we want to make GUI app quickly, you are not going to use C or C++. We will use other languages to make our life easier.
So the point is that whatever we wanna do, we use "tools" that are good for doing for we wanna do. "Photoshop" for editing photos. "Unity" for developing games. "JS" for making your web pages dynamic. And processing.js for making animations and interactions easily.

Today you are going to learn a new language and a new library aimed at making animations and interactions through code easily. You will observe that programming languages usually share basic concepts like variables, numbers, functions, loops, if, etc.

And we will be learning it on our own. And we will be using the thing called the internet. That's what developers do(In the real world, you don't find a physical teacher to teach you all the things you want to learn.). They learn new stuff(languages and library) to solve new problems. Our life is filled with learning new stuff every day. Since you guys are new, we will make things a bit easy for you by using a platform called KhanAcademy. It has videos, exercises, quizzes to help you learn the required concepts.

### Are you bored?

These are just basic techniques. Knowing how to use a tool is boring, but once you learn these skills, you can make anything that comes to your mind! Of course what you've learnt in the past hour doesn't make you the most skilled ;) Check out the projects that other students made at khan academy: https://www.khanacademy.org/computing/computer-programming/browse . You can view the code for these demos, try to remix them and change a few things, or combine ideas from multiple things and make something cool on your own!

You can also checkout https://noopschallenge.com/challenges. These challenges give you freedom to use the language of your choice to develop something fun and interesting.