My day-to-day as Front-End Developer in 2017
In 2015 I wrote about my day to day as a Front-End Developer. Two years late, follows my workflow in 2017.
Workplace
I’ve been worked remotely at Filtro since 2015. I’m living on same place and my house is my workplace yet.
My apartment has a balcony, very important to relax when I’m drinking a coffee. The condominium of building has a pool (I almost never use it) and a gym, that I’ll several times on week.
I also have two cats! An awesome source of fun and entertainment :D
Infrastructure
Today I’m working with a Macbook Pro MJLT2LL with macOS Sierra:
- Screen Size: 15.4 inches
- Screen Resolution: 2880x1800
- Processor: 2.5 GHz Intel Core i7
- RAM: 16 GB DDR3 SDRAM
- Graphics Coprocessor: AMD Radeon R9 M370X 2048 MB
It is an amazing laptop and I’m using the Boot Camp to run Windows 10 to play some games.
I don’t use mouse, first because the Macbook Trackpad is fantastic, second because I don’t always have it at disposal and I like to keep the same development conditions in different places to don’t decrease work productivity.
I’ve used the LG 23' IPS as my secondary screen yet.
Apps
- Sublime Text 3, as text editor
- Material Theme, as Sublime’s theme
- Google Chrome, as main browser
- Dev Tools, to debug
- Hyper, as terminal
- Sketch, as layout editor
- Jira, to project issues
- Skype, for calls
- Slack, for team communication
- Dropbox, to cloud storage
- Google Calendar, to personal organization
- Spotify, as music player
- 1Password, as password manager
- iA Writer, to notes
- Feedly and Medium, as readers
- Twitter, as main social media
- FrontEndBR, as main discussion group
Workflow
- My own coding style, to coding style rules
- Kratos Boilerplate, as boilerplate
- Node.js, to back-end
- Harp, as static generator
- Git, for version control system
- NPM, as package manager
- NPM Scripts, to handle the tasks
- GulpJS, as task-builder
- Browsersync, to sync devices
- Pug, as template engine
- ESLint, to JavaScript lint
- Stylus and PostCSS, as CSS pre-processor
- Parker, as stylesheet analysis tool
- cssnano, for CSS compress
- Font Magician, to get webfonts
- Lost, as grid system
- Rupture, as media queries helper
- Rucksack, to make CSS development less painful
- Atomic CSS, as CSS methodology
- BEM, to components nomenclature
As I said in 2015 article, tools and apps just help so we can deliver the best work. The most important is the concept, because the tools are temporaries, but the concepts can be applied for a long time…
You rock ;)
Twitter: @felipefialho_
Github: @felipefialho
Site: felipefialho.com