Alejandro Fernandez Herrera
Frontend engineer
- Creative person
- Passionate programmer
Who am i ?
Personal Details
Hi there 👋🏻, I am a frontend engineer living in Almería, Spain. With experience in efficiently coding websites and applications using different kinds of technologies (JavaScript / Angular2(v13) / Ionic(v6) / Nodejs / WordPress / PHP / HTML5 / CSS3 / MongoDb / MySql). Really passionate about everything that has to do with web technologies, especially Javascript and its constellation.
Open, dynamic, sincere character, with strong attention to detail and good communication skills.
- Name: Alejandro Fernández Herrera
- Age: 37
- Address: Aguadulce, Almería - Spain
- Nationality: Spanish
What I'm best at
Skills & Knowledge
- HTML5, responsive web, Flex CSS & Layout
- Frontend arquitecture: Monorepo & Micro-frontend
- Redux (ngrx) state management
- Web Components, reusability
- GIT, code review & CI
- API Rest & documentation
- Database & Microservice architecture
- RxJS 6 & ECMA 6
- PWA and service worker
- Task tracker for sprints, Jira
- (Jest, Jasmin, Karma, cypress)
- Scrum & Agile
- Animations
- Storybook, component documentation
- SPA + SEO
My Background
Work Experience
2021March - Current date
Senior frontend developer
Developing new features, maintenance, and innovation with new technologies/solutions in a dev team, influencing decisions on the architecture, and appearance of the product in a startup, Almería / Spain::
- Twenix Platform frontend is divided into several apps, running on Angular and Ionic. Those apps are built, managed, and hosted in a unique and central repository. Based on the monorepo architecture by Nwrl. Those apps share business logic as services, guards, components…etc, which are implemented in shared libs inside the same monorepo architecture.
- Simultaneously working collaboratively with UI/UX department to create and feed our own Design System, including design tokens and icon library. All are listed and well-documented on a private internal Storybook page. Speaking, front and UI/UX, same language based on the DS. Basing the creation of our own web-components on reusability and user research feedback, and always following the atomic design concept.
- Projects and DS are designed and developed with a clean and scalable architecture, modularity, and reusability of the web components. Using Typescript, the Design System and the internationalization module for translation. And using styled components with SCSS following the BEM convention.
- Worked with a structured dev team divided into 2 different and independent squads, which always can collaborate together. Using Scrum/Agile methodology to coordinate the team in the completion of tasks and time management. Using Jira as well as project management tools and communication with product managers.
- Improving and using the good practices for code review with pull request concept, adding testing coverage to new features or legacy code.
- Following standard processes such as a pull request, code review, and CI/CD to ensure the code base quality and fast delivery.
- Writing articles and talking for small events. Assisting with internal/external workshops, and dev conferences to then share knowledge across the FE teams.
- Participating in selection processes and interviews for hiring new candidates.
2019November - 2021February
Senior frontend developer
Developing new features with new technologies/solutions in a dev team, influencing decisions on the architecture of the product in a startup, Berlin / Germany:
- Developing internal SPA to Freachly Business customers to bring them all analytics and information related to their profile and the interactions of users with their business. The project is a PWA running on Angular (v.9). using a microfrontend architecture to keep separate the different parts of the complete application. Making the development and maintenance easier, modular and more scalable. The project has a responsive web version and a native version built on Nativescript, to reuse most of the code base from the Angular project.
- Creating a core repository (the base of the microfrontend hierarchy) with a reusable UI library for reusable components in templates and a library for the app logic in the reusable way as services, ngrx, interceptors, resolvers, guards… Via gulfile tasks, different repositories composing the microfrontend architecture will be automated to build into one working project (final app). While all the different levels work as well as independent project following the hierarchy.
- Implementing reusable web components using HTML5 and SCSS following the BEM convention to keep it simple and clean.
- Using Scrum/Agile methodology to coordinate the team in the completion of task and time managing. Using Jira as well as project management tool and communication with product managers.
- Working closely with UI/UX designers to deliver the best layout and components for the product.
- Following standard processes as pull request, code review and CI/CD to ensure the code base quality and for fast
delivering. - Automatization for the integration of translation files in the app which are added from web service into the app via
pipelines. This allow non-developers to handle all translations in an easy and maintenable way.
2018April - 2019October
Frontend engineer
Developing new features with new technologies/solutions in a dev team, influencing decisions on the architecture of the product in Berlin / Germany:
- Working simultaneously in two projects addressed to the same product, Kupfer Software, a fleet management tool for installer companies. First project is a PWA using Angular (v.8). Used as a desktop app for consuming an API based on a microservices architecture. Second project is a PWA using Ionic (v.4) over Angular(v.8). Used as mobile app for consuming the same API.
- Both projects were designed and developed with a clean and scalable architecture, modularity and reusability of the web components. Using Typescript, Redux (ngrx) for state management and internationalization module for translation. And using styled-components with SCSS following the BEM convention.
- Worked with a structured team, using Scrum methodology based on Agile using Jira for the management of tasks and sprints efficiently.
- Direct work with the UI/UX department for following the design style guides and interchange of ideas or
corrections. Using Sketch and Zeplin. - Implementing and improving the processes related to code integration with Drone, pull request and code
reviews, in git hub, for good practices and ensuring a good unit test coverage with (Jest, Jasmin, Karma) for a
clean and robust codebase. - Assisting to internal/external workshops, dev conferences to then share knowledges across the FE teams.
- Participating in selection processes and interview for hiring.
2011November - 2018January
Full Stack Developer
Develop and maintenance of web apps with modern web technologies in an agency, Berlin / Germany:
- Project development with Angular (v.5). with angular universal and angular material.
- Implementation of API Rest with MongoDb + Express. Additionally, working with third party APIs.
- Development of CMS projects, functionalities, multilanguage… (WordPress, Drupal).
- Web development with modern technologies HTML5, CSS3 (Stylus preprocessor), PHP, JavaScript, frameworks as jQuery and Bootstrap.
- Adapted responsively to all devices different types of projects and web structures.
- Implementation of a payment system for third-party services such as Saferpay or Paypal.
- Working with third-party APIs such as Google Maps.
- Design and administration of MySQL database systems.
- Tracked and solved tickets for defects on bug reporting tool (DasTodo).
- Development of the product and the concept of the brand-new idea of the project. Working with internal and external designers and UI & Ux.
- Participating in discussions with clients to clarify their needs.
2007March - 2009September
Frontend Collaboration
Maintenance and update the web site of the Department of Culture. Handling information about cultural programs and activities for the region of Almeria / Spain.
- Working with a groupware technology (Lotus Notes). Based in comunication, colaboration and coordination.
- Making decisions about frontend features and design changes.
2005April - 2005September
Frontend – Intership and collaboration
Completing an intership of first 2 months and staying with the team 2 additional months before joining university for degree. Learning methods focused in maintenance and development of web projects
- Developed web projects with different web technologies, HTML4, CSS2
- Developed and mainteined the frontend functionality of web projects
My Preparation
EDUCATION & COURSES
2005September - 2011June
Diplomat in Computer Engineering Science
- Web develop (Html, Xml, Dom, Javascript, Css, Php basic).
- Databases (Mysql, case tools, design, maintenance and handle of databases).
- Software develop (Java, C basic).
- Computer Networks.
- Structure of computers (programming MIPS assembler).
Extra courses by University of Almeria
- Security in Linux and Windows systems [April 2009].
- Introduccion to development to rich web applications for database with ajax [March 2011].
2003September - 2005June
Higher technical in development computer applications
Preuniversity level, 2 years.
- Database (Mysql server).
- Web develop (Html, Jsp, Asp, Asp.net).
- Software develop (Java, Visual Basic).
My communication
LANGUAGES
Mother Tongue
Spanish
2011June
English B2
Official title by University of Cambridge Level B1 (2011).
2014January
German B1
Official title by Telc Language Certificates B1 (2014).
My work
Portfolio
- ALL
- ANGULAR2
- BOOTSTRAP
- HTML5
- Ionic
- RESPONSIVE
- SILVERSTRIPE
- WORDPRESS
ALL ANGULAR2 BOOTSTRAP HTML5 Ionic RESPONSIVE
ALL ANGULAR2 BOOTSTRAP HTML5 RESPONSIVE
ALL ANGULAR2 BOOTSTRAP HTML5 Ionic RESPONSIVE
ALL ANGULAR2 HTML5
ANGULAR2 HTML5 RESPONSIVE
BOOTSTRAP HTML5 RESPONSIVE
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
BOOTSTRAP HTML5 RESPONSIVE
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
RESPONSIVE WORDPRESS
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
WORDPRESS
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
RESPONSIVE WORDPRESS
RESPONSIVE WORDPRESS
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
WORDPRESS
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
RESPONSIVE WORDPRESS
RESPONSIVE WORDPRESS
RESPONSIVE WORDPRESS
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
WORDPRESS
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
ALL HTML5 RESPONSIVE
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
RESPONSIVE
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
SILVERSTRIPE
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
SILVERSTRIPE
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor.
Here is a long quotation here is a long quotation proin gravida nibh vel velit auctor aliquet aenean sollicitudin.
This is Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet.
Contact