Adebiyi Adedotun, Developer in Lagos, Nigeria
Adebiyi is available for hire
Hire Adebiyi

Adebiyi Adedotun

Verified Expert  in Engineering

Front-end Developer

Location
Lagos, Nigeria
Toptal Member Since
October 22, 2021

Adebiyi is a design and front-end engineer passionate about building simple and functional web interfaces and experiences. He has worked as a front-end engineer, technical writer, and developer advocate in the health, cloud computing, fintech, and logistics industries. He's been published on technical blogs like CSS-Tricks, Smashing Magazine, and LogRocket. Adebiyi understands how to translate business needs into technical requirements with compelling solutions.

Portfolio

The Septum
Next.js, Styled-components, Content Management Systems (CMS), Sanity Studio...
HatchPath
HTML, CSS, JavaScript, React, Next.js, Vercel, Algolia, Firebase, Chakra UI...
Ceviant
React, Axios, JavaScript, HTML, CSS, Styled-components, Framer Motion, Formik...

Experience

Availability

Part-time

Preferred Environment

Visual Studio Code (VS Code), Jira, Figma, Slack, GitLab, GitHub

The most amazing...

...thing I've created is the documentation site of a large 3-in-1 company. I rebuilt and fused the sites into one that continues to stand the test of time.

Work Experience

Founder

2022 - PRESENT
The Septum
  • Developed the front-end website with Next.js, including reusable components and data fetching from Sanity CMS and Markdown. Used Vercel Analytics and Fathom. Worked on SEO with OG images and shareable links/buttons for major social media sites.
  • Developed and fetched content from Sanity CMS with fully customizable fields and dynamic segments.
  • Designed the website and its overall architecture.
Technologies: Next.js, Styled-components, Content Management Systems (CMS), Sanity Studio, Responsive Web Design (RWD), CSS3, REST APIs, Vercel, Stripe, GitKraken, date-fns, Day.js, MacOS, Visual Studio Code (VS Code), Front-end, GraphQL, JSX, Pixel Perfect, TypeScript, CI/CD Pipelines, Responsive Web Apps, Web Design, APIs, User Interface (UI), UI Development, Data Visualization, SVG

Front-end Engineer

2023 - 2023
HatchPath
  • Developed a coaching marketplace that enables clients and coaches to book sessions/programs, meet on a video call, and accept payment with Stripe.
  • Developed a Calendly-like calendar feature that allows clients to schedule meetings with coaches based on their availability.
  • Designed and developed reusable and responsive components for cards, forms, search, modals, etc., simplifying and reducing development time with well-tested abstractions.
  • Developed and managed a video call feature with Twilio video with features like a countdown timer and video mirroring, helping keep the product's core in-house and avoiding the enormous external cost of purchasing.
Technologies: HTML, CSS, JavaScript, React, Next.js, Vercel, Algolia, Firebase, Chakra UI, Tailwind CSS, Day.js, date-fns, Formik, TypeScript, Jira, GitLab, Stripe, GitKraken, Content Management Systems (CMS), Authorization, Authentication, MacOS, Visual Studio Code (VS Code), Slack, React Query, Front-end, JSX, Pixel Perfect, CI/CD Pipelines, Responsive Web Apps, Web Design, APIs, User Interface (UI), UI Development, Data Visualization, Redux, Unit Testing, Dashboards, SVG

Lead Front-end Engineer

2022 - 2022
Ceviant
  • Created several reusable UI components like select, button, tag, table, calendar, input, etc., using styled components for the base styling and as a means to override or extend the base styling wherever needed.
  • Developed a dashboard layout with the necessary ingredients for consistency, like empty, loading, and data UI for data fetching states. Also factored in contextual states like filters and search.
  • Introduced new security approaches for the application regarding public, protected, and private paths to streamline the authentication process with sessions.
  • Worked on several authentication mechanisms like 2FA, automatic logging out of user (when idle), browser fingerprinting, etc.
  • Handled the manual creation of HTML emails. Examples include auth emails like login, signup, forgot password, etc.
Technologies: React, Axios, JavaScript, HTML, CSS, Styled-components, Framer Motion, Formik, Next.js, FlatFile, Fingerprint.js, Base UI, SWR, Husky, Git, Storybook, Front-end, Figma, D3.js, Responsive Web Design (RWD), CSS3, REST APIs, Vercel, GitKraken, Jira, Authentication, Authorization, MacOS, Visual Studio Code (VS Code), Slack, REST, JSX, Pixel Perfect, TypeScript, CI/CD Pipelines, Responsive Web Apps, Web Design, APIs, User Interface (UI), UI Development, Data Visualization, Context API, Unit Testing, Dashboards, SVG

Developer Advocate

2021 - 2022
Edgio
  • Collaborated with engineers to write, review, and update content like blog posts, guides, and documentation for supported technologies, improving support for multiple users and technologies.
  • Liaised with the marketing team to oversee the creation of e-books with external contributors from companies like Algolia, Cloudinary, and Vue Storefront.
  • Managed a community of developers and users across forums and social platforms like Discourse, helping triage issues, announce product updates, and advocate for a faster web.
  • Collaborated with the internal marketing team and selected engineers from companies like Algolia, Cloudinary, Uniform, and Vue Storefront to create e-books that major on topics like the Core Web Vitals.
Technologies: Next.js, React, Front-end, Tailwind CSS, Styled-components, Figma, Material UI, Responsive Web Design (RWD), CSS3, REST APIs, Vercel, MacOS, Visual Studio Code (VS Code), Slack, JSX, Pixel Perfect, TypeScript, CI/CD Pipelines, Responsive Web Apps, APIs, User Interface (UI), UI Development, Technical Writing, Technical Documentation, Context API, Unit Testing, SVG

Front-end Engineer

2019 - 2021
Kobo360
  • Collaborated with a team of software engineers to rebuild the customer and partner dashboard to improve performance, maintainability, and stability.
  • Implemented form components with Formik to manage approximately 50 unique forms with Yup as an object-schema-based validator.
  • Developed easy-to-use and straightforward table components using HTML tables to manage approximately 40 unique tables to represent tabular data.
  • Created a simple state-management solution with the React Context API, eliminating the learning curve and overhead of previously used alternatives like Redux.
  • Achieved a robust mechanism to synchronize tabular pagination and data filtering using the URL to persist state, thus improving usability.
  • Translated both the customer and partner dashboards into four different languages, resulting in idiomatic and inclusive dashboards.
  • Styled the customer and partner dashboards to account for bidirectionality in right-to-left languages using CSS logical properties where applicable.
  • Created new HTML email templates with a unique design that prioritized structure and data visibility.
Technologies: JavaScript, HTML, CSS, Next.js, Styled-components, React Router, Formik, HTML Email, Front-end, Responsive Web Design (RWD), CSS3, REST APIs, MacOS, Visual Studio Code (VS Code), Slack, Postman, REST, JSX, Pixel Perfect, CI/CD Pipelines, APIs, User Interface (UI), UI Development, Node.js, Azure, Context API, Unit Testing, Dashboards, SVG, Internationalization, i18n

Front-end Engineer

2019 - 2019
WiseLead Company
  • Designed and implemented the complete dashboard for Microsoft Excel Club, using tools like React, styled-components, Azure DevOps, Formik, and Microsoft Azure.
  • Refactored and implemented the landing page for Rejist into React from a pure HTML and JavaScript template.
  • Built HTML templates for auth processes, such as login, logout, forgot password, reset the password, etc.
Technologies: HTML, CSS, JavaScript, Azure, Azure DevOps, Microsoft Excel, React, Styled-components, Formik

Front-end Engineer

2017 - 2018
Algorism Limited
  • Helped build an association and club management platform. I designed and developed user interfaces and implemented them for the landing page and dashboards.
  • Helped build a real estate property management platform, where I designed and implemented the password retrieval authentication flow.
  • Contributed to design and development processes for both non-technical purposes, like project management, and technical ones, such as designing and developing the undertaken products.
Technologies: HTML, CSS, JavaScript, Redux, React, Figma

Dashboard for a Virtual Health Coaching Marketplace

https://hatchpath.io
HatchPath is a virtual health coaching marketplace where clients can book sessions with coaches, meet via video calls, and facilitate payments through Stripe. In a small team of five, I worked as an engineer and developed core features like a Calendly-like calendar that allows clients to schedule meetings with a coach during their available date and time, reusable and responsive components for cards, forms, search, etc., in-house video calling with features like a countdown timer and video mirroring, helping keep the product's core in-house and avoiding the enormous external cost of purchasing.

Documentation Site for Edgio

https://docs.edg.io
This is a Next.js and MDX-based documentation site. It has development features like Husky, testing, Webpack, and GitHub Actions. It has features, including theming (light and dark), Algolia search, code syntax highlighting with diff and tabs, and a recursive custom and reusable side navigation dropdown.

Marketing Site and Dashboard Application for Ceviant Finance

https://app.ceviant.co/account/login
I led the front-end team that built the marketing site (landing pages, blog, newsletter, etc.) and customer dashboard. I architected and created the authentication and authorization flow with features such as 2FA, idle timeout, and browser fingerprinting. I also built the dashboard layout by coordinating with the designers on Figma. I created a robust design system with Storybook. The components developed included buttons and tables, form inputs, specific functionalities, and design using the overriding pattern. I also worked with collecting large data with Flatfile, unified forms with Formik, and elevated state up to the browser URL for UI state persistence for different aspects like tables (when filtered, paginated, or on page refresh). I also wrote several HTML emails with MJML.

Website for a Media Company

https://theseptum.com
The Septum is a media and publication company. I built and am building the website with Remix, Tailwind CSS, and Sanity.io (a headless content management system). It is mobile responsive and works with a staging and production environment.

Kobo360 Partner Dashboard

https://partner.kobo360.com
This is a dashboard for logistics startup, Kobo360 that caters to the partners'/drivers needs. I built this from the ground up, working closely with UI/UX designers, back-end engineers, and product managers.
2013 - 2017

Bachelor's Degree in Computer Science

University of Ilorin - Ilorin, Nigeria

SEPTEMBER 2023 - PRESENT

The Joy of React

Josh W Comeau

SEPTEMBER 2023 - PRESENT

Type Transformations

Matt Pocock

AUGUST 2023 - PRESENT

CSS for JavaScript Developers

Josh W Comeau

OCTOBER 2020 - PRESENT

Master Gatsby

BosType Inc

MARCH 2020 - PRESENT

MERN Stack Front To Back: Full Stack React, Redux & Node.js

Udemy

JULY 2019 - PRESENT

The Modern GraphQL Bootcamp (with Node.js and Apollo)

Udemy

JANUARY 2019 - PRESENT

Beginner JavaScript

Bostype Inc

OCTOBER 2018 - PRESENT

Advanced React and GraphQL

Bostype Inc

Libraries/APIs

React, React Router, Formik, Yup, react-spring, REST APIs, Context API, D3.js, Stripe, React Query, Node.js

Tools

Slack, ITerm, Git, GitHub, Figma, GitLab, JSX, Webpack, Jira, Postman, Microsoft Excel

Frameworks

Next.js, Chrome, Tailwind CSS, Material UI, Remix, Redux

Languages

JavaScript, HTML, CSS, TypeScript, Markdown, CSS3, MDX, GraphQL

Paradigms

REST, Azure DevOps, Responsive Web Design (RWD), Unit Testing

Platforms

Firefox, Safari, MacOS, Visual Studio Code (VS Code), Azure, Sanity Studio, Vercel, Algolia, Firebase

Industry Expertise

Web Design

Storage

FlatFile

Other

Styled-components, SWR, ESLint, Front-end, User Interface (UI), UI Development, Computer Aided Software Engineering, HTML Email, Apollo, Framer Motion, Base Web, Content Management Systems (CMS), Pixel Perfect, CI/CD Pipelines, Responsive Web Apps, APIs, Technical Writing, Technical Documentation, Data Visualization, Dashboards, SVG, i18n, Axios, Fingerprint.js, Base UI, Husky, Storybook, Authentication, Authorization, GitHub Actions, Chakra UI, Day.js, date-fns, GitKraken, Headless Software, Discourse, Internationalization

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