Front-End Overview

Description

There's a lot to cover these days in web development and this can often seem overwhelming. This workshop aims to cover a broad scope of areas of the front-end in smaller manageable chunks giving people a great base in which to start upon and progress.

Throughout the day, follow Simon on a journey as he dives into a number of front-end disciplines. Using a static site generator as a means to create meaningful demos, this workshop is jam packed with useful information and takeaways you'll be able to implement straight away. Along the way Simon will be showing you some of the tips and tricks he uses in his own work flow to keep up productivity.

At the end of this workshop you will be able to set up a site, save your history with git, collaborate on GitHub, be familiar on how to design a site taking into consideration different devices it will be used on, how to help with bringing people to your site and making it performant, how to structure your code so it is maintainable, easy and fun to work on and learn a variety of workflow tips to help keep you productive.

Topics covered

• Static site generators
• Git / GitHub pages
• Design principles
• Responsive web design
• CSS / Sass + animation
• Style guides and components
• Browser and device testing
• Performance
• Automation
• SEO (Search Engine Optimisation)
• Accessibility
• Progressive web apps
• Bonus: Health and productivity hacks

Who this is for

The workshop is suitable for anyone who wants to get a clearer picture for the overall front-end. You may have created a website or two, but want to ramp up your skill set and take things to a new level.

It might be that you've concentrated on another skill based around the web; design, copywriter, back-end, data analytics etc… and you work with front-end developers, or that you're interested in doing more front-end yourself.

You might already be a well established developer, but you're looking for a refresher and hone in on certain other areas you haven't touched yet and interested in knowing how to get started.

What you will need to bring

All optional and completely up to you, but I'd highly recommend the following to get the most of the workshop:

• A laptop (I'll be using a Mac and I can offer most support here, but Windows and Linux is also fine), or something to take a lot of notes with.
• If you'd like to follow along, it would speed things up if you already had a GitHub account, along with Git and Node installed on your machine.
• Feel free to get a static site, or stack of your choice up and running in advance if you have a preference. If not don't worry, as I'll be going over this.
• A text editor (Sublime Text, Visual Studio Code, Atom or similar).
• A terminal / commandline application (Ex. iTerm2 for OSX, or cmder for Windows).

Date

The workshop will take place on Thursday, 15th March.

Training venue

The venue is Citylabs just off Oxford Road. Nelson St, Manchester M13 9NQ.

Structure

Thursday, 15th March.

• 09:00 - 09:30 Registration
• 09:30 - 11:00 Workshop: 'Part 1'
• 11:00 - 11:20 Break
• 11:20 - 13:00 Workshop: 'Part 2'
• 13:00 - 14:00 Lunch
• 14:00 - 15:30 Workshop: 'Part 3'
• 15:30 - 15:50 Break
• 15:50 - 17:20 Workshop: 'Part 4'

Afterwards you are invited to another location (TBC) if you wish to continue talking about the day further, or just unwind.