Giter VIP home page Giter VIP logo

snake-workshop's Introduction

🐍 Snake workshop

Vibes!

  1. The idea is for everyone to have something to show off and play with
  2. That means no-one will be left behind
  3. The way we're not going to leave people behind is that everyone's going to be unblocking each other in Slack. If you're stuck, post a sentence or a screenshot and everyone else will help to unblock you. The aim of this is to try to get everyone to be self-sufficient.
  4. We'll gloss over some things and generalise a bit. Some of the code could be neatened up with some clever tricks, but we'll leave those alone for now. This might feel a bit frustrating for some, but it's just too overwhelming to try and learn everything all at once. For now we'll have to let some magic be magic and focus on the essentials ✨

Stuff we'll encounter!

  1. Getting setup for coding
  2. The terminal
  3. Coding for the web
  4. Essential Javascript
  5. Variables
  6. Functions
  7. If statements
  8. Classes
  9. Arrays (referencing indexes; pushing, shifting)
  10. Loops
  11. p5.js (a creative coding library)
  12. The developer tools in Google Chrome
  13. Unblocking yourself
  14. Unblocking others
  15. Reading errors
  16. Seeing me mess up loads

Setup!

  1. Make a coding folder with a snake folder in it from the command line
  2. Download Atom
  3. Get prettier
  4. Download empty snake template (with p5.js) and open it on localhost

A Blob!

  1. Explain what snake is
  2. Explain how p5 draws stuff and it's draw and update functions
  3. Make a blob
  4. Move it around

Apples!

  1. Make apples pop up
  2. Eat the apple

A Snake!

  1. Grow the snakes body when it eats an apple

Death!

  1. Make the snake die when it hits a wall
  2. Make the snake die when it hits itself

Ideas for after!

  • Show the score
  • Make everything all nice and pastel coloured. Go nuts with styling.
  • Ensure the apple doesn't pop up on a square where the snake's already at.
  • Add a box on the web page so that you can control the speed without changing the code.
  • Snake 2 (go through walls).
  • Translate your code into Python for extra snake points 🐍🐍🐍
  • Import an image of a real apple.
  • Deploy it to the web with it's own domain name
  • Train a machine learning algorithm to play snake 🤖
  • Pay it forward - teach this workshop to someone else!

Useful links

snake-workshop's People

Contributors

nazwhale avatar

Watchers

James Cloos avatar avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.