CodeHub 2016 - CSS a layout and Git workshops

Posted on: 17 November 2016

This year we have focused a lot on our JavaScript group, while the hack night has also gained traction. We organised two workshops as well, though. Both took place at the Momentum Offices and were each attended by about 20 people. Here’s the summaries and links:

CSS layout

In March, Carl Hughes gave a workshop on CSS layouts. It’s exciting times: For the first times there are CSS specifications that are explicitly intended for creating layouts. Flexbox is already widely implemented in major browsers, and Grid Layout should be available in spring 2017 (currently behind a flag).

Carl started with a presentation about the history of CSS layouts: From tables, to floats, table-layout and inline-blocks to Flexbox and Grid layout. Which ones have you used in your web development career? - You can find the slides here http://slides.com/codekipple/css-layout#/

Carl focused on what is probably the best method to create a grid layout, if you don’t want to use a framework or Flexbox: A standalone and nestable grid system using inline-block elements. He created exercises for using this grid system, as well as some for Flexbox and Grid layout. Check them out!

You can see the exercises here: http://codehuborg.github.io/css-layout/ and this is the repo you will need to clone: https://github.com/CodeHubOrg/css-layout (The grid styles are here https://github.com/CodeHubOrg/css-layout/tree/master/css)

If you want to learn more about the new Grid Layout module, this is a great resource by Rachel Andrew: http://gridbyexample.com/

This is the meetup page for the event: https://www.meetup.com/CodeHub-Bristol/events/228462974/

Git beyond the basics

The other workshop was run by myself and David Moody. The aim of the workshop was to introduce Git concepts like merging, rebasing and working with remotes.

I started with a presentation about these concepts. You can find the slides here: http://slides.com/katjadurrani/git-workshop

For the practical part, there were some Git scenarios exercises to solve here: https://github.com/CodeHubOrg/gitworkshop/tree/master/docs and you can see the resulting website here: https://codehuborg.github.io/gitworkshop/ People mostly worked in pairs and in teams. Many thanks to David Moody who helped with this part and gave lots of valuable advice.

Meetup page for the event: https://www.meetup.com/CodeHub-Bristol/events/234099506/

By Katja
Posted in Categories: css git