A mob programming web app for real-time collaboration at in-person events. The goal is to make the most of meetups/classes where a group of people with laptops are all sitting together in a room!

Table of Contents:

• Learn About Mob Programming
• Project Goals
  • Next Goals (for Version 2.0.0)
  • Goals for Version 1.0.0 (DONE!)
• Version 1.0.0 Documentation
  • Events List
  • Flowchart
• Project Log

• What is mob programming? by the Agile Alliance
• Video: "Mob Programming, A Whole Team Approach" by Woody Zuill
• Article: "Introducing Mob programming: The best team technique you've (probably) never heard of" by Daniel P. Dern
• MobProgramming.org and the Mob Programming Conference

• (Done) Simple login system using GitHub authentication
• (Done) Display players' GitHub usernames and profile photos
• (Done) Use a nice code editor for features like line numbers, syntax highlighting, etc (Using Ace for this)
• (Done) Save code from each session in a Gist using GitHub API and give credit to each contributor accordingly!
• Run code within the app and display the output, similar to repl.it or CodePen or kodeWeave or Dabblet
• Add moderator controls (ideas include kicking out players, pausing the game, choosing whose turn it is, changing the timer duration, etc)
• (Maybe) Reintroduce anonymous user feature (just that they don't get credit for their commits, or they can only observe?)
• Add support for multiple game rooms
• Reintroduce non-turn-based collaborative text editor mode
• (Crazy idea for later) Add support for multiplexed/tabbed invididual code editors that users or moderators can watch all at once, like a control room at a TV production studio! Maybe users can set permissions to make their "room" open to collaborators or just to viewers.

• Just a turn-based, collaborative plain text box!
• Countdown timer displays the remaining time for each player and resets after each turn
• Players can enter their name or stay anonymous
• Active player list displays names and highlights whose turn it is
• App displays who has the current turn and who has the next turn
• App gets the user's attention somehow when it's their turn
• Tools: NodeJS, Express, SocketIO, plain vanilla JavaScript and HTML/CSS

High-level, simplified state chart:

Note: As of 2017-07-10, client-side game state currently handles the editor content differently, using a separate Ace Editor object instead.

{
  timeRemaining,
  turnIndex,
  currentGist: {id, url, owner},
  players:
    [
      {id, login,avatar_url}, { ... }, { ... }, ...
    ],
  editor:
    {
      content,
      cursorAndSelection: { cursor: {column, row}, range: { end: {column, row}, start: {column, row} },
      scroll: {scrollLeft, scrollTop}
    }
}

Today's notes: https://learningnerd.com/2017/03/28/

Milestones:

• Started this project! Created the repo, created HTML mockup for the UI, wrote the first set of project goals.

Today's notes: https://learningnerd.com/2017/03/39/

Milestones:

• Version 0 (branch v0-shared-editor): collaborative real-time text-editing now works, yay! Just a simple shared text editor.

Today's notes: https://learningnerd.com/2017/03/31/

Milestones:

• Finished and cleaned up version 0 (branch v0-shared-editor) with collaborative real-time text-editing (no turn-based system).

• Version 1 (branch v1-turnbased-simple) with turn-based system now works!

Milestones:

• New feature: added Ace (an open source embeddable code editor) to replace the plain text box, and it works great!

Milestones:

• Ace editor now syncs scroll, cursor, and selection changes between all clients!

Milestones:

• Finished the GitHub login for static websites tutorial that I had started last week and now I think I finally understand promises, the point of environment variables, and the basics of GitHub authentication and API requests in general!

• Started new branch (github-auth) to require users to log in via GitHub before starting the game

• Finished the user login and GitHub authentication features! Users now have to log in with GitHub before they can play, and the game displays their GitHub username and avatar.

• Did my first live user test at my weekly web dev study group! Got some great feedback on the app and identified a couple bugs (which I think I already fixed in my dev branch).

Today's notes: https://learningnerd.com/2017/04/06/

Milestones:

• Finally started using the Dotenv package to manage local environment variables.

• Switched to handling GitHub authentication with my own server and learned how to make a new route that makes a POST request from Node and redirects the user back to the homepage with their GitHub access token. Woohoo!

• Set up production version with Heroku environment variables, no more hard-coded URLs or client ID (for now, just using an AJAX request to get the client ID from the server).

• Did a second user test, this time virtually, with this fun practice problem from r/DailyProgrammer! Got some good feedback and identified some more bugs.

Today's notes: https://learningnerd.com/2017/04/07/

Milestones:

• Made my first commit using just the GitHub API (via command line testing it out with cURL)!

• Researched GitHub's features and API more to identify how I could structure this app.

Today's daily learning blog post: https://learningnerd.com/2017/04/10/

Milestones:

• Started keeping learning notes in my blog, instead of just dumping them all in here. (Better to reserve this doc just for short summaries.)

• After a lot of wasted time because of a couple typos, I successfully created a new GitHub gist from within my app using a client-side AJAX POST request to the GitHub API!

Today's daily learning blog post: https://learningnerd.com/2017/04/11/

Milestones:

• Successfully created, forked, and edited a gist using the GitHub API!
• Integrated new events and logic flow into the app for saving version history using GitHub gists!
• The app can now create and edit gists on each user's turn, but not working for forks yet.

Today's daily learning blog post: https://learningnerd.com/2017/04/12/

Milestones:

• Fixed the turn change logic to work properly with saving version history using the GitHub Gists API.

Today's daily learning blog post: https://learningnerd.com/2017/04/13/

Milestones:

• Fixed the bug where any code written in the delay between forking and editing a gist gets attributed to the wrong player.

Today's daily learning blog post: https://learningnerd.com/2017/04/13/

Milestones:

• Fixed the bug where any code written in the delay between forking and editing a gist gets attributed to the wrong player.

Today's daily learning blog post: https://learningnerd.com/2017/06/21/

Milestones:

• Moved some notes from this README into separate blog posts, added Table of Contents to README.
• Fixed setup script so that it no longer overwrites the .env file if it already exists.

Today's daily learning blog post: https://learningnerd.com/2017/06/27/

Milestones:

• Finally posted a bunch of issues for next refactoring tasks, bugs, and feature ideas.
• Started refactoring and closed issue #1.

Today's daily learning blog post: https://learningnerd.com/2017/06/28/

Milestones:

• Finally got the app working again!!! Successful live user test at tonight's web dev study meetup! (The server never crashed!)

• Added updated flowchart and events list to this README for version 1.0.0 documentation.

• Fixed the main (most obvious) bug, closing issue #8 ("Error thrown when client calls updateCurrentGistView the first time to create initial Gist")!

• Closed issue #3 ("Simplify client-side code for determining when to fork/edit Gist"), which lead to opening issue #20 ("Game state should track previous and current player for Gist forking/editing logic"), which I closed with pull request #25, which then led to opening issue #24 ("If current player disconnects, next turn can trigger unwanted Gist fork").

Today's daily learning blog post: https://learningnerd.com/2017/06/29/

Milestones:

• Realized most of yesterday's work was based on an incorrect assumption, so threw out pull request #25 and replaced issue #20 and issue #24 with issue #26 ("Game state should track Gist owner for forking/editing logic") -- a much better solution!

• Closed issue #26, solving that bug once and for all! Updated the flowchart accordingly.

Today's daily learning blog post: https://learningnerd.com/2017/06/30/

Milestones:

• Created high-level UML state machine diagram, added to this README for version 1.0.0 documentation.

Today's daily learning blog post: https://learningnerd.com/2017/07/03/

Milestones:

• Closed #issue #4 ("Change game start condition to check state of the player list")

• Opened issue #29 ("Sometimes when last user disconnects (maybe while turn is changing?), server crashes")

• Merged issue #5 ("Consolidate the playerListChange and updateState events") into issue #16 ("Simplify the game state data model and events on client and server") and updated issue #16.

• Finished initial rewrite of events list and game state data model, started the major refactoring task for issue #16, stripping out all the guts of this app and replacing them all!

Today's daily learning blog post: https://learningnerd.com/2017/07/10/

Milestones:

• Main refactoring task completed! Finally closed issue #16 ("Simplify the game state data model and events on client and server"), also closing issue #18 and issue #14 in the process!

• Added game state and updated events list for version 1.0.0 documentation in this README.

• Closed [issue #15 ("Send GitHub access token as a header, not as a URL parameter")(#15)! Not sure if this is the best solution, but I can't think of a better way to handle client-side authentication without sessions.