Required to be present by 10:00 am EDT each day during the project.
#  Project #1: The Game
## Overview
Let's start out with something fun - **a game!**
Everyone will get a chance to **be creative**, and work through some really **tough programming challenges**– since you've already gotten your feet wet with Tic Tac Toe, it's up to you to come up with a fun and interesting game to build.
**You will be working individually for this project**, but we'll be guiding you along the process and helping as you go. Show us what you've got!
## Technical Requirements
Your app must:
* **Render a game in the browser**
* **Switch turns** between two players
* **Design logic for winning**& **visually display which player won**
* **Include separate HTML / CSS / JavaScript files**
* Stick with **KISS (Keep It Simple Stupid)** and **DRY (Don't Repeat Yourself)** principles
* Use **Javascript or jQuery** for **DOM manipulation**
* **Deploy your game online**, where the rest of the world can access it
* Use **semantic markup** for HTML and CSS (adhere to best practices)
## Potential Project Ideas
##### Connect Four
(seperate markdown file with directions)<br>
[Connect Four](https://en.wikipedia.org/wiki/Connect_Four) is a two-player game which is probably a thing in your universe, but feel free to read up on it if you'd like to.
##### Blackjack
(seperate markdown file with directions)<br>
Make a one player game where people down on their luck can lose all their money by guessing which card the computer will deal next!
##### Self-scoring Trivia
Test your wits & knowledge with whatever-the-heck you know about (so you can actually win). Guess answers, have the computer tell you how right you are!
### Suggested Ways to Get Started
* **Wireframe** Make a drawing of what your app will look like in all of the stages of the game (what does it look like as soon as you log on to the site? What does it look like once a player enters their name? What does it look like while the player is playing? What does it look like when the player wins / loses?).
* **Break the project down into different components** (data, presentation, views, style, DOM manipulation) and brainstorm each component individually.
* **Use your Development Tools** (console.log, inspector, alert statements, etc) to debug and solve problems
* Work through the lessons in class for help and inspiration! Think about adding relevant code to your game each day - you are given 5 days so that you can work on it in small chunks, COMMIT OFTEN. We will be looking at your commit dates and comments are part of your scoring.
* **Commit early, commit often.** Don’t be afraid to break something because you can always go back in time to a previous version.
* **Consult documentation resources** (MDN, jQuery, etc.) at home to better understand what you’ll be getting into.
* **Don’t be afraid to write code that you know you will have to remove later.** Create temporary elements (buttons, links, etc) that trigger events if real data is not available. For example, if you’re trying to figure out how to change some text when the game is over but you haven’t solved the win/lose game logic, you can create a button to simulate that until then.
## Deliverables
By the time the project is over, we will expect the following from you:
* A **working game, built by you**, hosted somewhere on the internet
* A **link to your hosted working app**
* A **git repository hosted on Github** NOT inside your wdi-remote repository. Frequent commits dating back to the very beginning of the project
* **A ``readme.md`` file** with explanations of the technologies used, the approach taken, a link to your live site, installation instructions, unsolved problems, etc.
Most importantly a **technical demonstration** of your app which:
* Is 5 minutes in length
* Shows off all features of the app
* Explains the technical details
* Explains the technical challenges
* Explains which improvements you might make
## Project Feedback + Evaluation
* __Project Workflow__: Do you have a Github respository for your project (not inside your wdi-remote repo)? Did you complete the user stories, wireframes, and the README.md file as specified above? Did you use source control (Github commits) as expected for the phase of the program you’re in (detailed above)?
* __Technical Requirements__: Did you deliver a project that met all the technical requirements? Given what the class has covered so far, did you build something that was reasonably complex?
* __Creativity__: Did you add a personal spin or creative element into your project submission? Did you deliver something of value to the end user (not just a login button and an index page)?
* __Code Quality__: Did you follow code style guidance and best practices covered in class, such as spacing, modularity, and semantic naming? Did you comment your code as your instructors have in class?
* __Deployment__: Did you deploy your application to a public url using GitHub Pages?
* __Total__: Your instructors will give you a total score on your project between:
**6** | Project Workflow | Do you have a Github respository for your project (not inside your wdi-remote repo)? | Did you complete the user stories and are they in your Github issues (2 points) | wireframes | README.md with specified information | source control with Github (commits) |
**6** | Technical Requirements | Did you deliver a project that met all the technical requirements? (discussed in your MVP (a score between 1-3 will be given))| Given what the class has covered so far, did you build something that was reasonably complex? (complexity will be given a grade 1-3) |
**2** | Creativity | Did you add a personal spin or creative element into your project submission? | Did you deliver something of value to the end user (not just a login button and an index page)? |
**2** | Code Quality | Did you follow code style guidance and best practices covered in class, such as spacing, modularity, and semantic naming? | Did you comment your code as your instructors have in class? |
**2** | Deployment | Did you deploy your application to a public url using GitHub Pages? |
**2** | Technical demonstration | Is 5 minutes in length & shows off all the features of your app. | Expalins technical details, technical challenges, and any improvements you might make. |
_Maximum possible points_ | **20** |
---
# Project Week
## Attendance
You are required to be present by 10:00 am EDT each day during the project.
## Standups
We will have student-run stand-ups each morning at 10:15 am EDT where you will answer the following questions:
- What did I work on yesterday
- What am i trying to get done today
@ -7,3 +107,49 @@ We will have student-run stand-ups each morning at 10:15 am EDT where you will a
This meeting should take no longer than 15 minutes.
If you have ideas on how you can help a fellow-student with work that they are stuck on, please follow-up with information AFTER the stand up.
## Meetings with instructors
_Your instructor will contact you to setup a meeting time_
**Tuesday, June 7**<br>
15 minute meeting to get your project approved. You will come with your [MVP](https://en.wikipedia.org/wiki/Minimum_viable_product) and an initial wireframe.
**Wedesday, June 8**<br>
15 minute progress check-in
**Thursday, June 9**<br>
Whole class instruction on how to deploy your project to the world wide web.
**Friday, June 10**<br>
15 minute check in to see where you are before you go into the weekend. Help you to decide what to finish and what features should be stretch goals.
## Where to go for help during project week
1. Seek out help online
2. Seek out help with your classmates
3. Seek out help with Derek (TA)
4. Submit a Github issue **on the wdi-remote** class Github account to receive help from an instructor
## Formatting your GitHub Issue for wdi-remote to ask for help
*PUSH OFTEN! Your code on GitHub should be up to date. Submiting an issue and linking us to old, out-of-date code will hinder the process.*
1. **WHAT YOU ARE TRYING TO SOLVE:**
- Write a detailed explanation of the feature or user story you're working on.
2. **DETAILED DESCRIPTION OF THE BUG/ERROR:**
- A detailed description of the problem, the bug, and/or the error. This means: the full steps to reproduce, a link to the file on github, and the line number of where the relavent code is.
The error(s) returned, copy and pasted/typed out/screenshot, not paraphrased.
- If there is other code in a different file that is also essential to the functioning of the code that currently works point us to that and explain the relationship.
3. **WHAT I'VE TRIED**
- List everything you've done to solve the bug on your own in detail. list all resources you've looked up and tried to implement and provide links. Providing code if you have it surrounded by the md syntax to display nicely is very helpful.
4. **QUESTION**
- After going through all this what is your questions specifically, more specifically than how can I make this work?
## Useful Resources
* **[MDN Javascript Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript)** _(a great reference for all things Vanilla Javascript)_
* **[jQuery Docs](http://api.jquery.com)** _(if you're using jQuery)_
* **[GitHub Pages](https://pages.github.com)** _(for hosting your game)_
Thom Page
10 years ago