Felipe is currently unavailable
Felipe Bernardes
Verified Expert in Engineering
Responsive UI Developer
Sorocaba - State of São Paulo, Brazil
Toptal member since January 15, 2018
Bio
Felipe is a skilled front-end and UI developer passionate about UX and creating and implementing next-generation user interfaces. His expertise in front-end development is based on a wide understanding and practice of core concepts from HTML, CSS, and JavaScript; he has been following these technologies over the past five years, always keeping up to date. He believes that developers, more than lines of code, must always deliver value.
Portfolio
J&J BabyCenter (via Toptal)
DFP API, JavaScript, SCSS, HTML, React, React Hooks, GraphQL, Apollo, Node.js...
Obmedia.com, LLC
HTML Email, Email on Acid, Email Markup, Email Coding, Pixel Perfect...
Translucent Computing
Docker, Jenkins, WordPress, Angular, AngularJS, Swift, Yarn, Gulp, Babel...
Experience
- Responsive UI - 7 years
- JavaScript - 7 years
- Git - 7 years
- Agile - 7 years
- Pixel Perfect - 6 years
- GraphQL - 3 years
- Progressive Web Applications (PWAs) - 3 years
- React - 3 years
Preferred Environment
Docker, Slack, Git, Webpack, Visual Studio Code (VS Code), Oh My Zsh, React, SCSS, iTerm2
The most amazing...
...project I've worked on is a web app for helping child and teen cancer patients and their doctors to improve their treatment by tracking their symptoms.
Work Experience
Senior Front-end Developer
2018 - 2021
J&J BabyCenter (via Toptal)
- Owned both the maintenance and evolution of BabyCenter's front-end codebases and the implementation of new projects using the latest technologies such as PWA, React/Hooks, GraphQL, and Next.js.
- Performed third-party integrations with services like GTM, AWS, and Snowplow/Google Analytics.
- Implemented a modern image optimization framework, including features like lazy-loading images, optimized image sizes and formats, fallback images, smooth UI/UX user transition, and graceful error handling.
- Oversaw production launches, watched logs, and made sure everything got to end-users smoothly.
- Researched, identified, and wrote front-end optimization backlog stories.
- Provided maintenance and evolved legacy codebases (based on Java and PHP technologies) while also translating them to a greenfield, new codebase based on React, Node.js, Next.js, Apollo, and GraphQL.
- Performed Google Core Web Vitals optimizations around FCP, CLS, and other new metrics for SEO and performance.
- Implemented pixel-perfect, from Sketch and Zeplin designs to React, HTML, and CSS using Styled Components, SCSS, and Material UI.
Technologies: DFP API, JavaScript, SCSS, HTML, React, React Hooks, GraphQL, Apollo, Node.js, Java, Spring, PHP, Next.js, Sass, Styled-components, Material UI
Senior Front-end Developer | Email Template Implementation
2019 - 2019
Obmedia.com, LLC
- Implemented around 60 email templates, from design to pixel perfection, over the course of six months, including CSS pixel perfection implementations, responsive emails, eventual corner-cases fixes specific to the device and clients' email.
- Tested my implementations on a wide range of devices and email clients using the EmailOnAcid professional testing tool to ensure optimal coverage. Also, fixed eventual corner cases specific to devices and/or email clients.
- Anticipated implementation limitations (related to specific email clients and/or devices) and coordinated with the design team to get to an optimal ground between design and implementation, while keeping the largest device and email client coverage.
Technologies: HTML Email, Email on Acid, Email Markup, Email Coding, Pixel Perfect, PSD to HTML, Email Templates, Litmus
Senior Front-end Developer
2017 - 2018
Translucent Computing
- Worked on a user-friendly web app for child and teen cancer patients and their doctors, helping them keep track of the status/symptoms, providing them insights for better treatment. Technologies included JavaScript (ES6), Chart.js, and WordPress.
- Created a car valuation iOS native app used in retail or person-to-person trade and re-selling from the UI design in Sketch to the implementation in Swift.
- Refactored old web apps which had JavaScript files of more than 2,000 lines of code, solved uncaught bugs, and improved the app's maintainability.
- Suggested and led weekly lightning technical talks to encourage knowledge-sharing between developers.
Technologies: Docker, Jenkins, WordPress, Angular, AngularJS, Swift, Yarn, Gulp, Babel, ECMAScript (ES6), JavaScript, SCSS, Sass, CSS, Pug, HTML
Independent Developer
2013 - 2018
Freelancer Web Developer
- Served as a front-end freelancer developing web and mobile apps.
- Designed and developed my own personal website, from sketches through pixel-perfect implementation.
- Provided in-person crash courses for modernizing teams with the newest JavaScript technologies and good practices.
Technologies: CSS, HTML, JavaScript
Full-stack Web Developer
2015 - 2017
Tegra
- Contributed to more than 11 different projects from various segments such as financial, retail, eCommerce, and events, from the start through shipping and maintenance.
- Developed GO, a product made by Tegra. Besides coding, I've implemented the product on its clients and also worked as a UI designer in the conception of GO's mobile app. Technologies used include Angular, NativeScript, Vue.js, Java, and C#.
- Founded and contributed to Tegra OSS organization's projects on GitHub.
- Structured and developed the internship program and trained interns. In my time there, I trained six interns and hired four of them, which turned out to be great developers nowadays.
- Implemented Scrum best practices on development teams, teaching and improving the company Scrum activities.
- Directly managed our interns, from onboarding through their projects, on daily meetings, weekly plannings, code reviews, and performance reviews.
Technologies: Docker, Jenkins, C#, Java, Ionic, Python, Django, Node.js, Vue, AngularJS, NativeScript, ECMAScript (ES6), JavaScript, SCSS, Sass, CSS, Pug, HTML
Front-end Developer
2013 - 2015
Going2 Mobile
- Designed and coded Carrorama's website. Carrorama is the main app of Going2 Mobile.
- Created rich UI prototypes for mobile apps using Sketch and Photoshop, maintaining and evolving the design guidelines.
- Implemented and managed DoubleClick for Publishers—DFP (former Google Dart) in two projects and managed and enhanced it in three other ongoing projects.
- Refactored many API calls in front-end projects to make them faster and providing nonblocking experiences to its users.
- Learned the best practices on DFP (DoubleClick for Publishers) in Google Blog and Google Academy.
- Set up and improved header bidding on DFP following best practices.
Technologies: WordPress, PHP, jQuery, JavaScript, SCSS, Sass, CSS, HTML
Experience
Felipe Bernardes | Personal Website
This is my personal website, designed and handcrafted by me. There you can read more about my career timeline and my side projects.
iDS App
https://ids.med.br/iDS is a medical diagnostics institute from Brazil. I've designed and developed their app—from initial sketches through implementation and publishing to the App Store.
App Store link: https://apps.apple.com/in/app/ids-instituto-de-diagn%C3%B3sticos/id1459203039
App Store link: https://apps.apple.com/in/app/ids-instituto-de-diagn%C3%B3sticos/id1459203039
GO - Retail Operations Management (Mobile and Web App)
GO is a product for managing and improving retail operations, both by providing a machine-learning powered mobile app to operators and providing decision-driven metrics to managers through web and mobile apps.
I was part of the concept & development team of the app, and acted as a frontend and mobile developer. Besides this, I also implanted the product on client's operations, following up users and improving the product UX.
I was part of the concept & development team of the app, and acted as a frontend and mobile developer. Besides this, I also implanted the product on client's operations, following up users and improving the product UX.
Tegra Website
http://tegra.com.br/Tegra is a development consulting company based on Sorocaba, Brazil. I designed and implemented their modern, blazing fast, and responsive website.
Eduqa.me Website
I designed & implemented Eduqa.me website.
Eduqa.me is a Brazilian startup on children education area. Their product is a web app for helping school directors have insight on how the school education/activities is going on, and a powerful tool to teachers share their best classes and activities across schools. The app also follows up on each child educational development.
Eduqa.me is a Brazilian startup on children education area. Their product is a web app for helping school directors have insight on how the school education/activities is going on, and a powerful tool to teachers share their best classes and activities across schools. The app also follows up on each child educational development.
SorocabaCSS Website
SorocabaCSS is a front-end local community of inner Sao Paulo, Brazil.
Besides developing the website, I'm part of the meet up organization.
We always seek to create inclusive, inviting meet ups in order to help people have access to front-end development by providing both trainings and talks of all technical levels.
Besides developing the website, I'm part of the meet up organization.
We always seek to create inclusive, inviting meet ups in order to help people have access to front-end development by providing both trainings and talks of all technical levels.
Carrorama Website
http://carrorama.net/Carrorama is a family of products for fleet control and car maintenance follow up. I've designed and implemented it's website, keeping the product visual identity.
Technologies/Tools used includes DFP, Header Bidding, SCSS, Bootstrap and Sketch
Technologies/Tools used includes DFP, Header Bidding, SCSS, Bootstrap and Sketch
PagFarma Mobile and Web App (1st place @ GS1 Brazil Hackathon)
https://github.com/mikemajesty/PagFarma-WebI spent 48 hours during a hackathon, as part of a team, designing and developing a product called PagFarma, winner of GS1 Brazil Hackathon.
Besides designing and developing, I also presented and pitched the product.
You can check out the screenshots and the code for it in the GitHub project repository.
Besides designing and developing, I also presented and pitched the product.
You can check out the screenshots and the code for it in the GitHub project repository.
Abroad (Indoor Location Web App)
https://github.com/mikemajesty/HackZurich-ProjectAbroad is a solution for indoor messaging & physical precise location based on Cisco Meraki technologies.
It was developed with the idea of assisting natural disaster recovery and searching for survivors, but can also be used as an indoor marketing tool.
We developed this webapp in 48h at 2016 edition of HackZurich, the biggest EU hackathon, alongside 600+ other people.
It was developed with the idea of assisting natural disaster recovery and searching for survivors, but can also be used as an indoor marketing tool.
We developed this webapp in 48h at 2016 edition of HackZurich, the biggest EU hackathon, alongside 600+ other people.
CodePen UI/Front-end Experiments
You can check out my HTML, CSS, and JavaScript creative experiments in CodePen.
There, you'll find my animations, UI snippets, and typography experiments.
There, you'll find my animations, UI snippets, and typography experiments.
Tech Speaker
http://speakerdeck.com/felipebernardesI'm a tech speaker at Brazilian communities. I've been sharing what I know with others since 2015. It's my give-back, since I learned a lot and improved both my personal and professional life by attending to meet ups within various communities.
You can check out my talks at my speakerdeck page.
You can check out my talks at my speakerdeck page.
Interviewer at Por Trás do Código
https://www.youtube.com/channel/UCf-FTIykTxE4UInzUS5Kv9QPor Trás do Código is a YouTube Channel I maintain alongside two friends, Celso Wo and Gabriel Jacquier.
There, we interview technology area professionals to bring creative insights to our viewers based on the interviewed persons' personal and professional life experiences.
There, we interview technology area professionals to bring creative insights to our viewers based on the interviewed persons' personal and professional life experiences.
Writer and Translator at EntryLvl
https://github.com/entrylvlEntryLVL is an open source blog I have alongside five friends.
We create and translate (from English to Brazilian Portuguese) entry-level content to programming newcomers and inexperienced people.
Our goal is to make knowledge more accessible to Brazilian people who don't speak English.
We create and translate (from English to Brazilian Portuguese) entry-level content to programming newcomers and inexperienced people.
Our goal is to make knowledge more accessible to Brazilian people who don't speak English.
Education
2013 - 2017
Technologist in Information Systems
Fatec Sorocaba - Sorocaba, Brazil
2015 - 2015
Specialization in Front End Development
Caelum - Sao Paulo, Brazil
Certifications
OCTOBER 2015 - PRESENT
Front-end Specialist
Caelum
Skills
Libraries/APIs
React, LocalStorage, HTML5 APIs, Chart.js, Flexbox, jQuery, DFP API, Web Audio API, HTML5 Canvas, Node.js, Vue
Tools
Zsh, Atom, NPM, Gulp, Sketch 3, UX Tools, Git, Litmus, Sequelize, Webpack, Photoshop CC, ITerm, Slack, Babel, Jenkins, Subversion (SVN), Email on Acid, Adobe Experience Design (XD), Oh My Zsh
Languages
SCSS, HTML, ES7, Markdown, Pug, Sass, CSS, JavaScript, ECMAScript (ES6), Swift, Java, C#, PHP, GraphQL, SQL, Python
Frameworks
Frameworkless, Ionic, AngularJS, Materialize, NativeScript, Yarn, Vanilla JS, Bulma, Bootstrap, Express.js, Angular, React Native, Django, Koa, Hapi.js, Spring, Next.js, Material UI
Paradigms
Responsive Web Design (RWD), Agile, DRY, Continuous Delivery (CD), Continuous Integration (CI), Functional Programming, Scrum, Unit Testing, Domain-driven Development, Object-oriented Programming (OOP)
Platforms
iOS, MacOS, Linux, Docker, WordPress, Mailgun, Heroku, Visual Studio Code (VS Code)
Storage
PostgreSQL, MongoDB, SQLite, MySQL
Other
HTML5 Animations, Header Bidding, Pixel Perfect, Sketch to HTML, Progressive Web Applications (PWAs), CSS3 Animation, Google Material Design, CSS Grid, Mobile First, Responsive UI, User Experience (UX), Front-end Development, HTML Email, Email Templates, Monitoring, React Hooks, Email Markup, Email Coding, PSD to HTML, Apollo, Styled-components, iTerm2
Collaboration That Works
How to Work with Toptal
Toptal matches you directly with global industry experts from our network in hours—not weeks or months.
1
Share your needs
Discuss your requirements and refine your scope in a call with a Toptal domain expert.
2
Choose your talent
Get a short list of expertly matched talent within 24 hours to review, interview, and choose from.
3
Start your risk-free talent trial
Work with your chosen talent on a trial basis for up to two weeks. Pay only if you decide to hire them.
Top talent is in high demand.
Start hiring