Senior Frontend Developer | VUE & Performance Expert

... of a leading sports retailer in the DACH region

• The engagement mainly included securing, analyzing, optimizing, and redeveloping the areas around front-end, front-end performance, PageSpeed, and Core Web Vitals. In addition to regular front-end development tasks, this involved ongoing research, monitoring, development, and implementation of performance optimization solutions. Both the project and communication language with the internationally distributed teams was English.

• Industry: Sporting goods / E-commerce

• Tech stack: Vue2, Nuxt.js (v2), TypeScript, JavaScript, Node.js, Jest, Sass, Tailwind CSS, HTML5, CSS 3.0, GIT, NPM, Webpack, Storybook, Responsive Web Design, Sentry, SonarQube, Jenkins, Jira, Confluence, DynamicYield, Google Tag Manager, Google Analytics, Google Search Console, SpeedCurve

• Responsibilities:

• Analyze and develop optimization opportunities for the existing codebase

• Implement new features and improvements

• Monitor performance of newly developed features

• Implement front-end components based on requirements and design specifications

• As part of the assignment, I provided front-end support for an online tool used to manage and calculate construction projects. The key focus was on using the Vue JavaScript framework's Composition API, which simplifies future upgrades from version 2 to version 3, implementing with TypeScript, and creating as-generic-as-possible components.

• Industry: Construction / Real Estate

• Tech stack: HTML5, CSS 3.0, TypeScript/JavaScript, Sass, Vue2, Composition API, Docker, GIT, NPM, Webpack, Jira, Living Styleguide, Responsive Web Design

• Responsibilities:

• Implement code architecture and components

• The overall project involved creating a white-label multi-portal application following current web standards while considering the specifics of an existing application. This included planning an adaptable and highly flexible front-end architecture. The provided designs and layouts were reviewed for user experience (UX) and tailored to the existing application in consultation with the client's relevant departments. After that, the application was broken down into as many reusable components as possible, and the technical definitions for implementing the related front-end tasks were created. Additionally, the development infrastructure was set up, the new code base was implemented, the general page structure was provided, implementation-ready components were supplied, and unit tests were written.

• Industry: Tourism / E-commerce

• Tech stack: HTML5, CSS 3.0, JavaScript, Sass, Vue2, Nuxt.js (v2), Vuex, jQuery, Jest, Figma, PHPStorm, GIT, NPM, Webpack, Jira, Atomic Design, Block Element Modifier (BEM), Living Styleguide, Responsive Web Design, Cross Browser & Cross Device Compatibility

• Responsibilities:

• Plan front-end software architecture

• Design review & design adjustments

• Subproject planning (ticket creation, implementation coordination for front end)

• Implement architecture, components, and tests

• During the project for the front-end agency Sevenval in Cologne, I optimized code structure, fixed bugs, and implemented new front-end requirements. This was for two customer and comparison portals in the finance & insurance and pension sectors. It required quickly and independently getting familiar with existing code, new technologies, and a new programming language. The project used HTML5, CSS 3.0, JavaScript, and XSL, among others.

• Technologies: HTML5, CSS 3.0, JavaScript, Sass, XSL, REST, SOAP, PHPStorm, GIT, NPM, Kiki, Rollup, Redmine, Jira, Responsive Web Design, Progressive Enhancement, Cross Browser Compatibility

• Responsibilities:

• Front-end development for “Insurance”, “Finance” and “Comparison & Consulting Portals”

• Quickly and independently getting familiar with existing code, new technologies, and a new programming language

• Optimizing code structure

• Implementing new features

• Bug fixing

• As an external contractor for an international agency, I revised and further developed an existing website project for a South German car manufacturer based in Bavaria. The tasks included quickly getting up to speed with the existing code and bug fixing the application, as well as further development and implementation of new features. For front-end development, modern technologies and tools such as HTML5, CSS 3.0, Less, JavaScript, jQuery, Handlebars.js, and Grunt were used. The work took place on site in Munich as part of an international team. The project language was English.

• Industry: Automotive / E-Commerce

• Technologies: HTML5, CSS 3.0, Less, JavaScript, jQuery, Handlebars.js, PHPStorm, AEM (Adobe Experience Manager), Grunt, JIRA, Confluence, GIT, Sightly, Responsive Web Design, UX, User Stories, Progressive Enhancement, Cross Browser Compatibility, Kanban

• Responsibilities:

• Front-end development in the automotive sector

• Quickly getting up to speed with existing code and its bug fixing & further development

• Implementing new features

• Code reviews and approving pull requests

A company focused on building sales channels needed a website for representation and lead generation. A design and structure concept was created based on user stories. The content was built on the basis of prior SEO research to produce search engine–friendly, target audience–specific content. In addition, a long-term plan for the website’s future content development was created. The technical implementation was carried out with SEO and performance in mind. Since its launch, the website has been continuously maintained, including monitoring and analysis using analytics tools. Based on the results, measures for further optimization are planned and executed.

Technologies used:

• HTML
• CSS 3.0/2.0
• OOCSS
• JavaScript
• jQuery
• PHP
• MySQL
• PHPStorm
• ProcessWire
• Performance optimization
• Search engine optimization
• Responsive web design
• Google Analytics
• Google Webmaster Tools
• UX
• User story
• Web content management
• Progressive enhancement
• Cross-browser compatibility

Tasks:

• SEO research & creation of an SEO concept
• Conceptualizing page structure, layout and design
• Search engine–optimized development
• Creation of search engine–optimized content
• Creation of a long-term content development plan
• Ongoing support with monitoring, extension and optimization

To optimally handle orders through all steps from order receipt, transfer to production and delivery, a system was needed that met all of the client’s individual requirements. This includes capturing and maintaining customer master data (contact details, special prices, recurring order options), product data (basic data, configuration variations, standard prices) and order data (history, order templates). To achieve a practical, needs-based result, the existing process was analyzed on site as part of requirements management, and the client’s wishes were documented. Based on use cases, a concept for implementation was created and executed.

Technologies used:

• HTML
• CSS 3.0/2.0
• OOCSS
• JavaScript
• jQuery
• AJAX
• JSON
• PHP
• OOP
• PHPStorm
• ProcessWire
• Performance optimization
• Use cases
• Scrum
• Cross-browser compatibility

Tasks:

• Analysis of existing in-house solutions
• Creation of use cases, requirements analysis, a detailed concept and a milestone plan
• Prioritization of the implementation sequence
• Testing
• Roll-out

Thanks to my high quality standards and my passion for web development, I have worked for well-known companies in e-commerce (Ochsner Sport AG / Deichmann Group), tourism (Europe’s third-largest tour operator, hotel.de / HRS), two South German car manufacturers, German internet service providers and directories (e.g., anwalt.de, steuerberater.net) as well as SMEs in real estate, the food industry, crafts and wholesale.

I was responsible for implementations in the areas of MICE, corporate rates, affiliates, and HotelCenter. This included maintaining, optimizing, extending, and adapting existing systems, as well as designing and implementing entirely new parts of presentation, booking, and search pages. My work covered the back end, database layer, and front end.

During the redesign/relaunch of the entire hotel.de platform, I was the main subproject lead for the technical implementation of the design concept.

Tools/Technologies used:

• HTML
• CSS 3.0/2.0
• OOCSS
• JavaScript
• jQuery
• AJAX
• JSON
• XML
• C#
• OOP
• ASP.Net
• MVVM
• WPF
• MVC3
• MSSQL
• Visual Studio 2010
• MS SQL Management Studio
• Scrum

Tasks:

• Further development of the hotel.de MICE portal "MARS"
• All areas (front end, back end & database for booker, hotelier & broker sides)
• Corporate rates (company-specific hotel rates)
• Developing an internal Windows tool to import, capture, and manage data records/rate statuses (front end, back end, database)
• Migrating old rate data into the new system
• Designing and implementing plugins/services to process and, if necessary, correct captured data
• Implementing the web component for TravelManager
• Unit tests
• Refactoring and performance optimization of existing SQL queries
• Affiliate center management
• Implementing a new affiliate concept by revising existing areas and developing new ones (front end, back end, database for booker, affiliate, and broker sides)
• Designing and implementing a crawler to detect and analyze integrations on affiliate sites
• Redesign / relaunch
• Main subproject lead for the technical implementation of the design concept
• Performance-oriented front-end implementation
• HotelCenter module
• Front-end implementation of a new area for hoteliers to analyze and optimize their own rate structures