Alan is available for hire
Hire AlanAlan Hadyk
Verified Expert in Engineering
React, TypeScript, and GraphQL Developer
Location
Myslowice, Poland
Toptal Member Since
April 2, 2021
Alan is a front-end architect adept at creating engaging UI across various industries and proficient in HTML, CSS, JavaScript, TypeScript, React, and Next.js. He is committed to best practices, team collaboration, and exceptional product delivery and is experienced in agile methodologies, cross-functional leadership, and REST and GraphQL integration for seamless back-end communication. Alan is a dedicated pro focusing on continuous improvement and technological trend adaptation.
Portfolio
SaaS for Content Writers
React, CSS, HTML, Tailwind CSS, JavaScript, TypeScript, Prisma, React Query...
Healthcare SaaS
Front-end, React, Tailwind CSS, TypeScript, Prisma, GraphQL, Apollo...
Real Estate Startup
JavaScript, TypeScript, React, Next.js, Tailwind CSS, Auth0, Webpack, Jest...
Experience
Availability
Full-time
Preferred Environment
JavaScript, TypeScript, React, Node.js, GraphQL, Jest, Cypress, React Query, Tailwind CSS
The most amazing...
...project I've worked on is an engine empowering community-led business. It was exciting to work on a product that enables communities to spark connections.
Work Experience
Front-end Architect
2022 - 2023
SaaS for Content Writers
- Engineered a TypeScript-based React single-page application using Vite, enhancing efficiency by 20% and decreasing development time by 25%.
- Designed a scalable app architecture utilizing design patterns like dumb and smart components and atomic design, incorporating React Query and Windi CSS to reduce UI design time by 30%.
- Employed React Query and Axios for robust communication with back-end systems, optimizing resource management and streamlining data fetching.
Technologies: React, CSS, HTML, Tailwind CSS, JavaScript, TypeScript, Prisma, React Query, REST, Vite, CSS Frameworks, ECMAScript (ES6), Front-end, GitHub, Figma, Web Development, Architecture, REST APIs, JSON, SVG, Atomic Design, Front-end Development, Web
Senior React Developer
2022 - 2022
Healthcare SaaS
- Developed captivating user interfaces for a healthcare application, resulting in a 15% increase in user engagement and a 10% improvement in user satisfaction.
- Improved loading speed and performance by 20% through the implementation of route lazy-loading and modularization of code into reusable components.
- Refined application architecture, reducing maintenance effort by 30% and increasing code readability and organization.
- Utilized GraphQL for seamless communication with back-end services, reducing data fetching time by 25% and enhancing the user experience.
Technologies: Front-end, React, Tailwind CSS, TypeScript, Prisma, GraphQL, Apollo, GraphQL Code Generator, React Apollo, Pixel Perfect, Responsive Web Apps, CSS, CSS3, HTML, HTML5, JavaScript, ECMAScript (ES6), GitHub, Figma, Web Development, JSON, SVG, Unit Testing, Front-end Development, Web
Front-end Architect
2021 - 2022
Real Estate Startup
- Developed the front-end architecture of a real estate web app, leading to a 35% increase in user acquisition and a 20% improvement in customer retention.
- Ensured adherence to coding standards and best practices, resulting in a 50% reduction in code-related issues during QA testing.
- Optimized project timelines, accelerating application development by 30% and enabling timely delivery of key features.
- Introduced GraphQL as a communicative means with the back-end system, boosting functional asset delivery by 40% and improving overall system performance.
Technologies: JavaScript, TypeScript, React, Next.js, Tailwind CSS, Auth0, Webpack, Jest, React Testing Library, Cypress, Node.js, Apollo, GraphQL, Docker, Pixel Perfect, Responsive Web Apps, CSS, CSS3, HTML, HTML5, ECMAScript (ES6), Front-end, GitHub, Figma, Web Development, Architecture, JSON, SVG, Atomic Design, Front-end Development, Web, Server-side Rendering (SSR)
Senior Full-stack Developer
2021 - 2021
Tribe Technologies
- Designed a scalable front-end architecture, resulting in a 20% increase in application stability and maintainability.
- Delivered features for both front-end and back-end applications, reducing development time by 20% and ensuring adherence to best practices.
- Expedited project timelines, ensuring timely delivery of application features and reducing time-to-market by 10%.
- Created reusable components, decreasing code redundancy by 25% and improving overall code quality.
- Authored unit, integration, and acceptance tests, enhancing code reliability and reducing the number of bugs by 30%.
- Leveraged GraphQL for seamless back-end communication, improving data handling efficiency by 20% and system performance by 15%.
Technologies: JavaScript, TypeScript, React, Next.js, Tailwind CSS, Chakra UI, Webpack, Jest, React Testing Library, Cypress, Node.js, NestJS, Apollo, GraphQL, Docker, GitLab, GitLab CI/CD, Pixel Perfect, Responsive Web Apps, CSS, CSS5, HTML, ECMAScript (ES6), Front-end, Web Development, JSON, SVG, React Apollo, E2E Testing, Unit Testing, Front-end Development, React Query, Create React App, Web, Server-side Rendering (SSR)
Senior Full-stack Developer
2018 - 2021
Omise
- Crafted a scalable front-end architecture for a payment systems application, contributing to a 20% increase in user engagement and a 15% improvement in user satisfaction.
- Accelerated project timelines by 20%, ensuring the timely development of application features.
- Developed an API gateway using the Express/Node.js server and Apollo/GraphQL stack, increasing back-end communication efficiency by 30%.
- Created reusable components, reducing development effort by 15% and enhancing code maintainability.
- Authored unit, integration, and acceptance tests, resulting in a 20% decrease in bugs and a 10% improvement in code reliability.
- Mentored junior front-end developers, contributing to a 15% increase in productivity and skills development.
Technologies: JavaScript, Ruby, React, Ruby on Rails (RoR), Sinatra, Styled-components, Webpack, Jest, Enzyme, React Testing Library, Cypress, Node.js, Express.js, Apollo, GraphQL, Docker, Jenkins, Buildkite, Jira, Museums & Exhibits, Basecamp, HTML, Redux, REST, CSS, Confluence, Continuous Deployment, CSS3, CSS3 Animation, Git, Google Lighthouse, HTML5, PageSpeed, User Interface (UI), ECMAScript (ES6), Front-end, GitHub, Fintech, Full-stack, Agile, Architecture, REST APIs, SVG, Pixel Perfect, Atom, Responsive Web Apps, Web Development, JSON, Atomic Design, React Apollo, Apollo Server, Storybook, CSS-in-JS, E2E Testing, Unit Testing, Front-end Development, Create React App, Web, CI/CD Pipelines
Senior Front-end Developer
2017 - 2018
SHIJI
- Contributed to the development of a hotel management application, resulting in a 30% increase in development efficiency and streamlined operations.
- Assisted in the creation of a React.js-based proof of concept (PoC), expediting the decision-making process by 40% and enabling faster project progression.
- Streamlined project timelines, ensuring the application's timely development in Ember.js with TypeScript and accelerating feature delivery by 25%.
- Created reusable components and managed adapters, models, and serializers, improving code organization and maintainability by 20%.
- Authored unit, integration, and acceptance tests, leading to a 30% reduction in bugs and a 15% increase in code reliability.
- Mentored junior front-end developers, enhancing their productivity and skills development by 20%.
Technologies: JavaScript, TypeScript, React, Redux, Ember.js, Sass, Docker, QUnit, Webpack, Node.js, REST, Zeplin, Jira, Jenkins, GitLab, Jest, HTML, Enzyme, Less, CSS, Continuous Deployment, CSS3, CSS3 Animation, Git, HTML5, Microsoft Teams, PageSpeed, User Interface (UI), ECMAScript (ES6), GitHub, Confluence, Front-end, Agile, Web Development, REST APIs, JSON, SVG, Pixel Perfect, Atom, SCSS, Responsive Web Apps, Storybook, E2E Testing, Unit Testing, Front-end Development, Create React App, Web
Front-end Developer
2015 - 2017
SAP
- Facilitated UI development and monitoring across various projects, improving cross-team communication by 30% and ensuring timely delivery of features.
- Implemented Agile methodologies across projects, resulting in a 20% increase in development efficiency and adaptability.
- Delivered university lectures, sharing expertise and contributing to the education of future industry professionals.
- Guided team members through rapidly evolving digital technology landscapes, boosting team comprehension of JavaScript frameworks by 30%.
- Enabled the product team to access valuable data sources and develop innovative features, increasing customer satisfaction by 25%.
Technologies: JavaScript, CoffeeScript, React, Redux, CSS Modules, Webpack, Node.js, Docpad, Jest, Enzyme, Jira, Stash, Bamboo, HTML, Adobe Photoshop, Sass, REST, CSS, Confluence, Continuous Deployment, CSS3, CSS3 Animation, Git, HTML5, PageSpeed, User Interface (UI), ECMAScript (ES6), GitHub, Front-end, Agile, Web Development, REST APIs, JSON, SVG, Pixel Perfect, Atom, SCSS, Responsive Web Apps, Atomic Design, Unit Testing, Front-end Development, Create React App, Web
Front-end Developer
2010 - 2015
dih.pl
- Optimized UI development for various eCommerce projects, resulting in a 30% improvement in design consistency and a 20% reduction in development time.
- Fostered professional development in CSS preprocessors, UI pattern libraries, and JavaScript task runners, improving team efficiency by 25%.
- Presented innovative approaches to engineers, contributing to the company's technical market presence and enhancing team knowledge.
- Fostered cross-functional communication with IT, end users, and stakeholders, resulting in a 25% reduction in miscommunication-related issues and faster project delivery.
- Advocated for the use of defect and enhancement tracking software, improving issue resolution efficiency by 30%.
Technologies: JavaScript, Sass, Less, jQuery, PrestaShop, Redmine, HTML, Adobe Photoshop, CSS, CSS3, CSS3 Animation, HTML5, User Interface (UI), Front-end, Web Development, REST APIs, JSON, Pixel Perfect, SCSS, Responsive Web Apps, Front-end Development, Web
Freelance Developer
2008 - 2010
Self-employed
- Leveraged personal referral networks to secure small job order contracts, expanding the freelance client base.
- Initiated self-motivation to acquire front-end development skills, enhancing personal marketability and expertise.
- Cultivated strong ties to the technology community through a demonstrated ability to deliver quality work.
- Coordinated the development of interactive web-based data visualizations, including interactive charts and maps, enhancing the user experience for clients' websites.
Technologies: CSS, HTML, JavaScript, jQuery, Adobe Photoshop, CSS3, CSS3 Animation, User Interface (UI), Front-end, Web Development, REST APIs, JSON, Responsive Web Apps, Front-end Development, Web
Experience
Personal Website
https://alanhadyk.dev/My personal website is a cutting-edge web application built with Next.js and Tailwind CSS, demonstrating my proficiency in front-end development and design.
In terms of styling, I swapped out styled-components for Tailwind CSS. This utility-first CSS framework enabled me to craft a custom, responsive design while writing less CSS. It made my website more performant by reducing the amount of CSS delivered to the client.
The source code for this website is openly available on my GitHub profile, encouraging the ethos of open-source contribution and demonstrating my coding practices. This transparency allows others to learn from, contribute to, and even critique my work, fostering a collaborative learning environment.
In conclusion, my personal website is a testament to my front-end development and design skills. It highlights my ability to stay abreast of industry advancements and showcases my commitment to continuous learning and improvement. The site's success in attracting business opportunities also underscores the value of these skills in the marketplace.
In terms of styling, I swapped out styled-components for Tailwind CSS. This utility-first CSS framework enabled me to craft a custom, responsive design while writing less CSS. It made my website more performant by reducing the amount of CSS delivered to the client.
The source code for this website is openly available on my GitHub profile, encouraging the ethos of open-source contribution and demonstrating my coding practices. This transparency allows others to learn from, contribute to, and even critique my work, fostering a collaborative learning environment.
In conclusion, my personal website is a testament to my front-end development and design skills. It highlights my ability to stay abreast of industry advancements and showcases my commitment to continuous learning and improvement. The site's success in attracting business opportunities also underscores the value of these skills in the marketplace.
Cryptonetic
I am the founder of Cryptonetic. This project is not publicly available yet.
Why Cryptonetic?
• The top 100 wallets hold 18% of Bitcoin's value. The biggest players can easily control the market at the expense of millions of smaller investors. Join the revolution and defy the establishment!
How does Cryptonetic work?
• It's very simple—earn trust tokens on the Cryptonetic platform and spend them by voting for cryptocurrencies you believe in. Trust tokens reflect your belief in the value of a particular project. For 50% of the value of each deposit, we will purchase the cryptocurrency you voted for. At the end of each month, we will draw users to win cryptocurrencies purchased with trust tokens.
What is Cryptonetic?
• Cryptonetic is an infinite map that lists all cryptocurrencies, and cryptocurrency exchanges, sorted by the trust people have in them. You will find detailed information about cryptocurrencies such as trading volume, volume, exchange rate, and position on our list. We will help you decide which cryptocurrency exchange to choose based on information such as the number of cryptocurrencies available, stable coins, daily volume, and market/taker commission.
Why Cryptonetic?
• The top 100 wallets hold 18% of Bitcoin's value. The biggest players can easily control the market at the expense of millions of smaller investors. Join the revolution and defy the establishment!
How does Cryptonetic work?
• It's very simple—earn trust tokens on the Cryptonetic platform and spend them by voting for cryptocurrencies you believe in. Trust tokens reflect your belief in the value of a particular project. For 50% of the value of each deposit, we will purchase the cryptocurrency you voted for. At the end of each month, we will draw users to win cryptocurrencies purchased with trust tokens.
What is Cryptonetic?
• Cryptonetic is an infinite map that lists all cryptocurrencies, and cryptocurrency exchanges, sorted by the trust people have in them. You will find detailed information about cryptocurrencies such as trading volume, volume, exchange rate, and position on our list. We will help you decide which cryptocurrency exchange to choose based on information such as the number of cryptocurrencies available, stable coins, daily volume, and market/taker commission.
Tribe
https://tribe.so/Tribe is an engine empowering community-led businesses, such as IBM, ASUS, and Pipedrive, and a customizable community platform.
I was deeply involved in the process of developing various features for the front-end and back-end layers of Tribe's social platform. Features such as setting custom domain, following posts, or FullStory integration allowed Tribe to gain new customers and increase revenue.
I was deeply involved in the process of developing various features for the front-end and back-end layers of Tribe's social platform. Features such as setting custom domain, following posts, or FullStory integration allowed Tribe to gain new customers and increase revenue.
Skills
Languages
JavaScript, TypeScript, GraphQL, HTML, Less, CSS, CSS3, HTML5, ECMAScript (ES6), SCSS, Sass, Ruby, CoffeeScript
Frameworks
Jest, Redux, Next.js, Tailwind CSS, React Native, Express.js, Cypress, Ruby on Rails (RoR), Sinatra, Ember.js, QUnit, NestJS
Libraries/APIs
React, jQuery, REST APIs, Node.js
Tools
Adobe Photoshop, Confluence, Git, React Apollo, Create React App, Webpack, Jira, GitLab, GitHub, Figma, GitLab CI/CD, Atom, Canvas 2D, Jenkins, Basecamp, Zeplin, Docpad, Stash, Bamboo, PrestaShop, Redmine, Microsoft Teams, PageSpeed, Canvas, Sequelize, Auth0, Prisma
Paradigms
REST, E2E Testing, Unit Testing, Continuous Deployment, Agile, Test-driven Development (TDD)
Platforms
Web, Docker, Buildkite, Firebase
Storage
JSON, PostgreSQL, MongoDB
Other
Styled-components, Sound Editing, Enzyme, React Testing Library, Apollo, CSS Modules, CSS3 Animation, User Interface (UI), Front-end, Web Development, SVG, Atomic Design, Apollo Server, Pixel Perfect, Storybook, CSS-in-JS, Front-end Development, Responsive Web Apps, Server-side Rendering (SSR), Museums & Exhibits, Architecture, Progressive Web Applications (PWA), Mastering, Mixing, Service Workers, Google Lighthouse, Fintech, Full-stack, NodeMailer, WebSockets, Chakra UI, GraphQL Code Generator, API Integration, React Query, Vite, CSS Frameworks, CSS5, CI/CD Pipelines
Education
2008 - 2010
Associate's Degree in Sound Engineering
Regionalny Ośrodek Edukacji - Katowice, Poland
2004 - 2007
High School Diploma in Information Technology
SOSW - Tarnowskie Góry, Poland