πŸŽ†πŸ‘·πŸ”§ Training workshops at Springload
JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
count-to-6
functional-javascript
tdd-workshop
test-anything
thinking-in-react
writing-good-code
.gitignore
LICENSE
README.md

README.md

workshops

                             \`.
   .--------------.___________) \
   |//////////////|___________[ ]
   `--------------'           ) (
                              '-'
  β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“
 β–‘β–“ Training workshops at Springload                                        β–“
 β–‘β–“ https://github.com/springload/workshops                                 β–“
 β–‘β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“β–“
 β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘β–‘

Built with love

🚧 😀 πŸ‘Œ
Functional JavaScript JS, functional programming, array extras X
Unit Testing JS, unit testing, tape X
Thinking in React JS, React, ES6 X
ES6 JavaScript JS, ES6 X
Writing Good Codeβ„’ Code smells, refactoring, OOP, FP, etc X
Child mode React React, without so much JS
Test-Driven Development JS, unit testing, TDD, refactoring, coverage
Another take on FP JS / iterating
Events! Event bubbling, capture, custom events
Scope this, const, let, var

Workshops

Functional JavaScript

Learn functional programming in JavaScript with a NodeSchool workshop! https://github.com/timoxley/functional-javascript-workshop.

To start the workshop

You'll need Node installed. Then, from the command line:

# To install the workshop:
npm install -g functional-javascript-workshop
# Then, to run the workshop:
functional-javascript

What did we learn?

  • For loops conflate three separate kinds of operations: filtering (Array#filter), reduction (Array#reduce) and transformation (Array#map).
  • Higher-order functions (functions that take other functions as parameter) are very common in JavaScript.
  • JavaScript's Array "extras" methods (map, reduce, filter, etc) are quite cool!

To go further

Unit Testing

Learn to test anything with TAP! https://github.com/finnp/test-anything.

To start the workshop

You'll need Node installed. Then, from the command line:

# To install the workshop:
npm install -g test-anything
# Then, to run the workshop:
test-anything

What did we learn?

  • Unit testing is a useful practice to increase code quality, and to make maintenance easier.
  • There are APIs built into Node and JavaScript to unit test code, like assert.
  • They aren't as good as open-source alternatives like tape, or Jasmine / Mocha + Chai.

To go further

Thinking in React

A workshopper module for learning React, based on Thinking in React.

To start the workshop

This workshop is heavily based on http://facebook.github.io/react/docs/thinking-in-react.html. Take a moment before you start to read the first two sections (Start and Step 1) from the comfort of your browser.

You'll need Node installed. Then, from the command line:

# To install the workshop:
npm install -g thinking-in-react
# Then, to run the workshop:
thinking-in-react

At any moment, you can see your solution in the browser by running: thinking-in-react server <solution file>. The React DevTools will help you a lot.

Note: We will make heavy use of JSX and ES6. Make sure that your editor has syntax highlighting for those.

What did we learn?

To go further

ES6 JavaScript

An intro to new features coming up in the next version of JavaScript, ES6 / ES2015. https://github.com/domenic/count-to-6

To start the workshop

You'll need Node installed. Then, from the command line:

# To install the workshop:
npm install -g count-to-6
# Then, to run the workshop:
count-to-6

What did we learn?

  • ES6 is JavaScript's latest version, introducing new syntax.
  • Since the browser support is not perfect, we compile it to ES5 using Babel.
  • ES6 has a lot of new features.

To go further

Writing Good Code Code Climate

An adaptation of a refactoring kata in JavaScript with Mocha and Chai https://github.com/thibaudcolas/gilded-roses.

To start the workshop

You'll need Node installed. Then, from the command line:

# To install the workshop:
git clone git@github.com:springload/workshops.git
cd workshops/writing-good-code/
npm install
npm install -g eslint eslint-config-airbnb eslint-plugin-react babel-eslint buddy.js
# Then, to run the workshop:
npm start
# Run the coverage
npm run coverage
open coverage/lcov-report/index.html
# Run the linting
npm run lint

What did we learn?

See writing-good-code/src/gilded_rose_solution.js for the end result.

To go further

Useful resources on writing good JavaScript:

Test-Driven Development

A refactoring kata in JavaScript with Mocha and Chai https://github.com/thibaudcolas/gilded-roses.

To start the workshop

You'll need Node installed. Then, from the command line:

# To install the workshop:
git clone git@github.com:springload/workshops.git
cd workshops/tdd-workshop/
nvm install
npm install
npm install -g eslint eslint-config-airbnb eslint-plugin-react babel-eslint
# Then, to run the workshop:
npm start
# Run the coverage
npm run coverage
open coverage/lcov-report/index.html
# Run the linting
npm run lint

What did we learn?

TODO

To go further

TODO

How to run a session

A workshop session involves the following activities:

  • Preparing the workshop
    • Researching content
    • Testing the content
    • Booking a time and place
    • Advertising the workshop session
  • Running the session (introduction, workshop, debrief)
  • Sending follow-up material to attendees

Rinse, repeat!

The preparation / follow-up phases usually take around two hours for one person, assuming that the workshop's material is pre-existent. The workshop session itself takes two hours for each attendee. It is also better if the participants have a bit of time before the workshop to prepare their environment, and after it to step back and reflect on their learning.

Finding workshop material

Our workshop usually take the form of NodeSchool workshopper modules.

Convincing your boss

If you work for Springload, your boss will be very keen to see you invest time in your team's skills.

The goal of a training workshop is to help people get better at their craft, acquire new skills and advance in their career. It is a low-overhead alternative to professional training that encourages self-training.

Bullet points:

  • Investing in your team's skills improves the quality of their work.
  • Use a vast collection of freely available, open-source workshop content.
  • Empower your team with the responsibility to train themselves.

Measuring the success of a workshop

  • Attendance (Number of people)
  • Attendees' opinion (ROTI, Return On Time Invested – not the bread)
  • Attendees' self-evaluation of their skills