Felipe Bernardes
Verified Expert in Engineering
Responsive UI Developer
Sorocaba - State of São Paulo, Brazil
Toptal member since January 15, 2018
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
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
Availability
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
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.
Senior Front-end Developer | Email Template Implementation
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.
Senior Front-end Developer
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.
Independent Developer
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.
Full-stack Web Developer
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.
Front-end Developer
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.
Experience
Felipe Bernardes | Personal Website
https://felipebernardes.github.io/iDS App
https://ids.med.br/App Store link: https://apps.apple.com/in/app/ids-instituto-de-diagn%C3%B3sticos/id1459203039
GO - Retail Operations Management (Mobile and Web App)
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/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.
SorocabaCSS Website
https://sorocabacss.github.ioBesides 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/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-WebBesides 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-ProjectIt 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
There, you'll find my animations, UI snippets, and typography experiments.
Tech Speaker
http://speakerdeck.com/felipebernardesYou can check out my talks at my speakerdeck page.
Interviewer at Por Trás do Código
https://www.youtube.com/channel/UCf-FTIykTxE4UInzUS5Kv9QThere, 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/entrylvlWe 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
Technologist in Information Systems
Fatec Sorocaba - Sorocaba, Brazil
Specialization in Front End Development
Caelum - Sao Paulo, Brazil
Certifications
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
How to Work with Toptal
Toptal matches you directly with global industry experts from our network in hours—not weeks or months.
Share your needs
Choose your talent
Start your risk-free talent trial
Top talent is in high demand.
Start hiring