- Fork and clone Tic, Tac, Toe Repo
- Ensure you have installed all dependencies/packages:
npm i
- Open
main.js
and look at the Unit Test, see what is being called, passed as input arguments, and what the expected results are. - Ensure you know how to run the unit test:
npm test main.js
+ctrl + c
to escape.
- Use a whiteboard to work out a solution. HOW DOES TIC, TAC, TOE actually work in excruciating detail?
- Translate the broad ideas to pseudo code
- Convert the pseudo code to real JavaScript Code
- Add the the JavaScript code you've come up with one step at a time in
main.js
- Work through your bugs.
- Use
node main.js
to run the game +ctrl + c
to escape. - Achieve green checks for each of your unit tests.
- Bonus Challenge: Since the game can only be won with three marks in a row, the minimum amount of marks required for a possible win is 5. There is no reason to run
checkForWin()
for marks 1-4. Adjust the program to only runcheckForwin()
after at least 5 moves have been made.
- Open
index.html
to find a pre-built 3x3 grid using<td>
tags (table-data)- This html file is styled with
tictactoe.css
- It also has a script tag that links it to
dom-tictactoe.js
- This html file is styled with
- Open
dom-tictactoe.js
. You'll find starter code that helps you attach the logic from part 1 to the DOM so a user can use the screen instead of the terminal to play the game. - Follow the instructions at the top of the js file to find the
@Todo
s and place your code in the appropriate place to make the game work!
- Push Yourself Further
- Create a new repo in GitHub, clone it
- Create an
index.html
file. - Create a
tictactoe-styles.css
file - Create a
tictactoe-scripts.js
file - Build your game working through each little step one must complete to do it.
This is where you get good!
- Run your unit tests first!!
- Use repl.it to write the solution code first. (it's a faster environment vs using the
node main.js
command over and over again.) - Read the comments in
main.js
- Use the JS Docs at W3S on Accessing the First Array Element
- Push yourself further.
- Look at your hints!
- Don't skip the planning portion!!
- Clone, setup, testing, and running instructions for all projects is below
-
Click the 'Fork' button (choose your account if prompted).
-
Copy HTTPS URL from your forked repository
-
In your terminal/gitBash/CommandPrompt navigate (using
cd
) into a directory where you want to start keeping your repositories. (/jsDevFolder
) -
Clone your new repository by typing
git clone <forked clone URL>
(the HTTPS URL you copied above) -
Now go into the new directory by using
cd project-repo
-
Add the base repository as an upstream
git remote add upstream https://github.com/AustinCodingAcademy/<PROJECT-REPO>.git
-
Check the configuration of your remotes with
git remote -v
, it should look very similar to this (except it'll be YOUR username)
$ git remote -v
origin git@github.com:username/javascript-workbook.git (fetch)
origin git@github.com:username/javascript-workbook.git (push)
upstream git@github.com:AustinCodingAcademy/javascript-workbook.git (fetch)
upstream git@github.com:AustinCodingAcademy/javascript-workbook.git (push)
-
From your project directory, run
npm i
to tell NPM to install all the node modules we use in this class (seepackage.json
) -
Use your textEditor (VS Code) to change your files.
-
When you're finished
git status
, stage your filegit add .
, commit your changesgit commit -m "functions working"
, and push to GitHubgit push
git status git add . git commit -m "Initial Commit" git push origin gh-pages
-
Now go to your forked repository on GitHub (at https://github.com/your-username/javascript-workbook). A little yellow box should have popped up asking you to make a Pull Request. Click to review.
-
Click "Create Pull Request"
-
Every time you make a change and push to GitHub, this PR will automatically update. No need to do it more than once.
-
To get the latest code/homework/test updates, be sure to have a "clean working directory" by committing or removing all of your changes. You check for a "clean working environment" by running
git status
and making sure no files show up. -
Run
git pull upstream gh-pages
Simply run node path/to/file.js
example node 01week/rockPaperScissors.js
Tests are a great way to make sure your code works the way you planned it would, and to make sure you don't break something in the future. We will be using them to test our understanding of the lesson. It's also our main way to assign grades for an assignment.
To run the tests on a file run npm test path/to/file.js
, etc.
Simply run npm run lint
- Run
npm start
- To break out of the server, press
ctrl
+c