Giulia is currently unavailable
Giulia Cardieri
Verified Expert in Engineering
Front-end Developer
Toronto, ON, Canada
Toptal member since September 19, 2018
Bio
Giulia is a creative and detail-oriented freelancer with a passion for front-end development and UI/UX design. She has over six years of experience developing web applications for professional, academic, and personal projects. Giulia is a CSS enthusiast, and she is always learning new technologies. She is a good communicator and values empathy between co-workers.
Portfolio
Stratacache
JavaScript, Vue CLI, Vue, CSS, SCSS, Adobe Experience Design (XD)
Kangaroo Solutions Inc
Vue 2, Vue, Vuex, React, React Native, Vuetify, Ionic, SCSS, Jest, Storybook...
Dog and Pony Studios
Nuxt.js, Vuex, Vue, Tailwind CSS, WordPress, Figma, Discord, jQuery, JavaScript...
Experience
- CSS - 7 years
- Sass - 7 years
- HTML5 - 7 years
- JavaScript - 7 years
- Vue - 4 years
- Progressive Web Applications (PWAs) - 3 years
- A11Y - 3 years
- Nuxt.js - 1 year
Work Experience
Intermediate Application Developer
2022 - PRESENT
Stratacache
- Updated HTML/CSS/Vue components for new Adobe XD designs on a digital menu board for a huge coffee-related restaurant in Canada.
- Implemented reusable components on Vue with Composition and SCSS for the digital menu board.
- Joined sprints and regular Agile-related meetings with a multidisciplinary team.
- Reviewed other front-end developers' code for quality assurance with an empathic and personal growth approach.
Technologies: JavaScript, Vue CLI, Vue, CSS, SCSS, Adobe Experience Design (XD)
Senior Front-end Developer
2021 - 2022
Kangaroo Solutions Inc
- Developed new features on existing applications. For example, a calendar feature based on Full Calendar and ICal string allowed restaurants and couriers to have a visual schedule for administrators.
- Collaborated on sprint and story points planning sessions as the front-end team lead. I wrote all Jira tickets, and as a team, we defined story points and chose which tickets would be part of a sprint.
- Created UI mockups using Figma for two new applications. The focus was to create a UI that was easy to develop using UI components from either Vuetify or Ionic libraries.
- Improved the code quality of the existing Vue app by refactoring Vuex to a module architecture, using proper Vuetify variables for CSS, and refactoring all API calls from plan Axios to a custom library.
- Reviewed the code from other front-end and full-stack developers, always focusing on empathy and improvements. Applied received feedback on the code I wrote and learned from others.
- Fixed multiple bugs on React and React Native apps that were used by multiple customers every day. Bugs were related to React lifecycle, CSS, and Formik.
Technologies: Vue 2, Vue, Vuex, React, React Native, Vuetify, Ionic, SCSS, Jest, Storybook, Agile, Figma, UI Design, UX Design, CSS, TypeScript, REST, REST APIs
Senior Front-end Developer
2021 - 2021
Dog and Pony Studios
- Developed multiple institutional websites using Nuxt.js, Vuex, and Tailwind CSS. All websites had micro animations and accessibility A and AA rules compliance as a requirement.
- Participated in team calls three days per week to discuss current projects through Discord, kept track of working hours using Harvest, and organized tasks using Asana.
- Coordinated closely with the design team to create pixel-perfect implementations of UIs created with Figma.
- Populated content, adjusted Gravity Forms instances, and created custom fields on WordPress admin to display correct data on the front end.
- Ran accessibility checks using the AXE tool on existing and new projects to make sure they were accessible. If not, troubleshoot and fixed bugs preventing accessibility compliance issues.
Technologies: Nuxt.js, Vuex, Vue, Tailwind CSS, WordPress, Figma, Discord, jQuery, JavaScript, Sass, Axe
Front-end Developer
2019 - 2021
The Winston Project LLC (via Toptal)
- Developed over 25 websites for universities based in the United States using a custom framework based on Hugo, jQuery, and SCSS.
- Implemented the front-end part of a design system with dozens of components in which accessibility was a requirement. The stack included Gridsome, Vue, Tailwind CSS, and VueX.
- Created documentation for each component in the design system to assist future members of the development team.
- Conducted accessibility checks using SiteImprove tool, troubleshooting, and fixed bugs if necessary.
- Developed the front-end part of an interactive tuition calculator for higher education using Vue, Scss, and VueX.
Technologies: Vue, A11Y, Gridsome, Hugo, Tailwind CSS, jQuery, SCSS, HTML, CSS, JavaScript, Figma, Slack, Vuex
Front-end Developer
2018 - 2019
Apollo (via Toptal)
- Developed responsive UIs using SCSS, HTML, jQuery, and Middleman.
- Implemented pages to display infographics in images and PDF formats.
- Recreated a complete website UI, previously built with React, using Middleman.
- Fixed issues regarding 301 redirects using Node.js.
- Troubleshot issues to resolve bugs and defects related to the front-end development.
Technologies: Git, Bootstrap, Flexbox, HTML5, CSS3, Sass, Zeplin, Node.js, Middleman, LocalStorage, JavaScript, jQuery, SCSS, CSS, HTML
UX Designer
2018 - 2019
TODXS
- Worked as a UX researcher on the chatbot team with three other people.
- Developed the chatbot's persona with the UX team. We decided to set this person as a female, non-binary early adult.
- Validated the chatbot with users through a survey using Google Forms.
- Researched and gathered data regarding the LGBT+ community to develop the chatbot content.
- Created a chatbot using Google's tool DialogFlow with the team.
Technologies: Web UX, Slack, Chatbots
Computer Science Graduate Researcher
2017 - 2019
Capes
- Developed a PWA architecture called PWA-EU. It is a mix of event-driven and layered software architectures so users can act as co-designers of an app. This freedom and flexibility are provided so users can make design choices on the PWA.
- Conducted software engineering and human computer-interacted experiments to evaluate and compare native mobile, web mobile, and PWA applications.
- Analyzed qualitative and quantitative data obtained from experiments and study cases.
- Wrote scientific articles describing the HCI experiments and PWA-EU approach.
- Developed and designed the proof of concept PWAs for the PWA-EU approach. The first, an event-scheduling app, was developed with Vue, CSS, and LocalStorage. The second was developed with Vanilla JavaScript, CSS, Handlebars.js and LocalStorage.
- Conducted training sessions to teach PWA in theoretical and practical ways to graduate and undergraduate students.
Technologies: Progressive Web Applications (PWAs), Materialize, UX Design, Git, Web UX, CSS, CSS3, HTML5, JavaScript, Sass, User Experience (UX), Vue, PWA
CSS Developer
2018 - 2018
Postbox (via Toptal)
- Developed UIs for a dark mode feature on a desktop app using plain CSS.
- Worked on a large codebase with dozens of CSS files.
- Debugged files to fix bugs and defects related to the front-end development.
- Used Git as version control to safely and quickly develop applications.
Technologies: Flexbox, HTML5, CSS3, Sass, Git, Firefox, CSS, HTML
Web Developer and Designer
2016 - 2017
LTIA
- Developed a full-stack web application using HTML5, Sass, jQuery, CodeIgniter, and MySQL for freelance clients. The app was a website with educational content for high school and undergraduate students of UNESP Bauru.
- Designed web applications for freelance clients using Photoshop.
- Worked on a team as a front-end developer (HTML5, Sass, and jQuery) to create a women empowerment social network for Microsoft's Imagine Cup competition.
- Assisted new members with lectures about front-end technologies (HTML, CSS, and SASS) and mentoring.
- Provided assistance after applications were delivered to clients.
Technologies: JavaScript, UI Design, Git, Web UX, HTML5, CSS, CSS3, MySQL, jQuery, Sass, HTML
Front-end Developer
2015 - 2015
Lecom
- Assisted with web system maintenance of Lecom business process management (BPM), focusing on HTML, CSS, JavaScript and jQuery. Lecom BPM on a process automation software based on web technologies.
- Contributed to UI prototype elaboration of Lecom BPM's new features.
- Created documentation of new functionalities developed on the Lecom BPM using jQuery and Vanilla JavaScript.
- Added REGEX validation to form input fields using Vanilla JavaScript.
- Worked with Agile methods daily, such as Scrum and Kanban.
Technologies: Git, HTML5, CSS3, Bootstrap, jQuery, JavaScript, CSS, HTML
Full-stack Web Developer
2014 - 2014
Tegra
- Designed a hybrid mobile application prototype using Photoshop.
- Created a hybrid mobile app with Cordova.js, HTML, Sass, Bootstrap, jQuery, and Gulp. This app was a catalog for a furniture store that needs all their furniture on the app and also had features in which users could customize their furniture.
- Refactored CSS and Sass code from the company's website.
- Worked with Agile methods every day, such as Scrum.
- Developed an application with Django framework, Sass, HTML5, and jQuery.
Technologies: UI Design, Git, HTML5, CSS, CSS3, Bootstrap, Gulp, jQuery, JavaScript, Sass, HTML
Project History
GeoFun!
https://geofun.vercel.app/GeoFun! is a website designed for children who are interested in learning more about countries around the world and geography. At GeoFun!, users can engage with an interactive map or explore a list to discover exciting facts about each country. The data is sourced from the Rest Countries API (https://restcountries.com/). All the illustrations, except the map, have been created using CSS.
Naturalmente Irritada
I created the blog "Naturalmente Irritada" (naturally irritated) to write about notable events like the volcano in Iceland in 2010 and the earthquake in Japan in 2011.
I implemented the blog's front and back end. I used Figma for wireframes and prototypes, inspired by a CSS drawing I made a few years ago on CodePen. Being a Vue fan, it wasn't challenging to choose Nuxt, a framework I've been familiar with for a few years. Nuxt 3 utilizes Vue 3, and it was exciting to develop a project using Vue 3 after several months of daily work with Vue 2. I also chose to use pure CSS, as the project wasn't large enough to justify the use of a preprocessor like SCSS.
The back-end part was more challenging, as I don't usually venture into that area. After researching the best headless CMS options to use with Vue 3, I opted for Strapi due to its ease of implementation and positive reports of its use with Vue 3 and Heroku.
I implemented the blog's front and back end. I used Figma for wireframes and prototypes, inspired by a CSS drawing I made a few years ago on CodePen. Being a Vue fan, it wasn't challenging to choose Nuxt, a framework I've been familiar with for a few years. Nuxt 3 utilizes Vue 3, and it was exciting to develop a project using Vue 3 after several months of daily work with Vue 2. I also chose to use pure CSS, as the project wasn't large enough to justify the use of a preprocessor like SCSS.
The back-end part was more challenging, as I don't usually venture into that area. After researching the best headless CMS options to use with Vue 3, I opted for Strapi due to its ease of implementation and positive reports of its use with Vue 3 and Heroku.
Giulia Cardieri - Online Portfolio
https://giuliacardieri.com/This website is a showcase of my favorite projects. It was designed in Figma and implemented using CSS and HTML5, focusing on A11Y principles. The project illustrations were implemented using CSS only.
Dinokiki
Dinokiki is my biggest and favorite personal project. It started in February 2014 as a way to learn more about JavaScript, and today, it is an interactive website with over 3,5000 views per month. It's a fun and entertaining website for all ages. It uses Vue, Sass, Node.js, and Express.js.
CSS Illustrations/Animations
I enjoy designing and developing CSS illustrations (sometimes animated) on CodePen. Most are built with HTML5, CSS/Sass, and JavaScript/jQuery.
Construtora Cardieri
http://cardieri.com.br/Construtora Cardieri is a construction company in Sorocaba, Brazil. I designed and developed a modern website so they can showcase their buildings and tell a bit about their story. It was developed for two months using Vue, Sass, Node.js, and Express.js.
Education
2017 - 2019
Master's Degree in Computer Science
Universidade Federal de São Carlos - UFSCar - Sorocaba, Brazil
2012 - 2016
Bachelor's Degree in Computer Science
Universidade Estadual Paulista - UNESP - Bauru, Brazil
2013 - 2014
Non Degree International Student (Brazilian Government Scholarship) in Computer Science
Rochester Institute of Technology - Rochester, NY
Skills
Libraries/APIs
Flexbox, Vue, jQuery, Vue 2, Vuex, LocalStorage, Node.js, React, REST APIs
Tools
Adobe Photoshop, Sketch, Git, Adobe Illustrator, Figma, Sublime Text, Slack, Zeplin, Gulp, NPM, Middleman, Vue CLI, Adobe Experience Design (XD)
Languages
CSS3, Sass, CSS, HTML5, HTML, JavaScript, SCSS, Hugo, TypeScript
Frameworks
Bootstrap, Materialize, Tailwind CSS, Yarn, Vanilla JS, Nuxt.js, React Native, Vuetify, Ionic, Jest, Express.js
Paradigms
UX Design, UI Design, BEM, Human-computer Interaction (HCI), Quantitative Research, Agile, REST
Platforms
MacOS, Firefox, WordPress
Storage
MySQL
Other
CSS Grid, Progressive Web Applications (PWAs), Web UX, Accessibility, A11Y, Gridsome, PWA, Chatbots, Google Material Design, App UX, Discord, Axe, User Experience (UX), User Research, Material Design, Storybook, Strapi
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