#LifeOfDevs
Front-end Developer
What do they do?
Specialised in programming user interfaces
A bridge between a Designer and Back-end developer
Core skills:
Bringing a design to life
Maintaining workflow management
Core
HTML
CSS
JavaScript
Browser compatibility
Responsive design
UI / UX
Other
Angular
React.js
Vue.js
jQuery
Grunt / Gulp / Webpack
Bootstrap / Foundation
Yeoman
Semantic UI
Sass/SCSS
AJAX
Back-end Developer
What do they do?
Specialised in performance, stability, security and speed
Builds everything that makes a web application function
Core skills:
API design and development
Manages databases
Handles security and authorisation
Core
Architecture
Analytical
Data(bases)
Security
Other
PHP
Ruby on Rails
Python
Java
MySQL / SQL(ite)
PostgreSQL
ASP.NET
Node.js
C# / C++
Full-stack Developer
What do they do?
They do both :-)
Other developers
App Developer
Software Developer/Engineer
Game Developer
Data Scientist
Big Data Developer
DevOps Developer
Graphics Developer
Other Tech
Task runners / package managers
Grunt
Gulp
NPM
Bower
Webpack
Compilers
CodeKit
Koala
LiveReload
Prepros
Scout
Text editors (IDE)
Atom
Sublime Text
Visual Studio Code
WebStorm / PHPStorm / IntelliJ
Brackets
Vim
Version control
Git
SVN
SourceTree
GitKraken
API Tools
Postman
Zapier
Runscope
Local dev environment
XAMPP / MAMP
Vagrant
Docker
CMS
WordPress
Joomla!
Drupal
Magento
Keeping updated
Resources
Official documentation
Stack Overflow
Online communities
Friends/colleagues
Tutoring/mentoring
Learning tech
Taking online courses
Reading blogs & books
Contributing to open source
Bootcamps
Conferences/Meet-ups
Love to hate
Another last-minute Waterfall feature
Interruption
Everything is a top priority
Other people's bad code
Documentation
Requests for tech support
Recruiters
New projects
Steps
Gather information
Architecture
Support
Performance & accessibility
Organisation
Gather information
Talk to the designer
Be involved in the design process
Understand the vision for the project and/or sprint
Get to know your team
Architecture
How dynamic is the application
Is it a SPA or server-side rendered?
Select tech stack
What's the CSS process
Set up code conventions
Support
Browsers
Devices
Documentation
performance & accessibility
Image formats and size
Compression
WAI-ARIA
(Web Accessibility Initiative – Accessible Rich Internet Applications)
Reduce HTTP requests
Minify
Organisation
File structure
Assets (icons, images, fonts)
CSS structure (BEM, Atomic, OOCSS)
Build tools
Framework
Back-end
Questions?
Made with Slides.com