ab.Anatolii Barkovskyi

Web development. By Anatolii.

Responsive websites.
Practical web tools.

I’m Anatolii. I build responsive websites, fix frontend issues, and connect interfaces to APIs — from landing pages to useful browser tools.

Explore my work
Small projects. Carefully considered.
  • React
  • JavaScript
  • TypeScript

Selected work / 04

Four independent projects. Four practical challenges.

Forma landing page with a product dashboard, bold headline and orange call to action

Forma

01

A landing page with room to grow.

A responsive SaaS concept with interactive pricing, an FAQ and a demo signup flow.

  • React
  • TypeScript
  • Tailwind CSS
Open live site
Inside the project

The brief

Present a fictional software product clearly, from the first impression to the pricing and signup experience.

The implementation

Reusable React components, monthly/yearly pricing, keyboard-friendly navigation and a signup dialog with input validation.

The result

A complete frontend demonstration across desktop, tablet and mobile layouts. Product claims, metrics and testimonials are illustrative; no accounts or payments are created.

● FRONTEND REPAIR / CASE 02BeforeAftercommon✳groundShop the collectionOur approachGet in touchThoughtful things.Everyday rituals.OBJECTS FOR YOUR EVERYDAYA little less noise.A little more space.Make room for the things that matter.Considered essentials for a calmer working day.Find your everyday ↗✳ Good design. Quiet company.THE EVERYDAY EDITLESS,better.IMAGE MISSING01 Considered design02 Everyday usefulness03 A softer paceIndependent demo projectTHE EVERYDAY EDITSmall things. Better days.04 essentialsLIGHTINGArc Table Lamp$89.00Enquire ↗AUDIOStill Wireless$129.00Enquire ↗STATIONERYField Notes Set$24.00Enquire ↗CERAMICSEveryday Mug$18.00Enquire ↗Before · Missing content, uneven layoutREPAIR STUDY

Common Ground

02

Small fixes. A better storefront.

A before-and-after case study in responsive layout, mobile navigation and form validation.

  • HTML
  • CSS
  • JavaScript
Open live site
Inside the project

The brief

Repair deliberately introduced storefront defects while keeping the original visual direction.

The implementation

Restore missing content, correct image proportions, fix mobile overflow and navigation, and replace false form success with field validation.

The result

A switchable before-and-after demonstration. The shop and products are fictional; the enquiry form does not send messages or process orders.

Compare the before screenshot ↗
atmos.YOUR WEATHER, AT A GLANCEWeather overviewSAVED PLACES00A little closer tohome.Save a city to find itsforecast here.A world of weather.One clear view.Weather Dashboard · PortfolioWorkspace › Weather overview● Powered by Open-MeteoTHE WORLD OUTSIDEWeather overviewA clear picture of the day ahead.Search for a city…LondonUnited KingdomSave place°C°FCURRENT WEATHER● Latest forecast20°COvercastFeels like 19° · H: 22° L: 14°◉ Illustrative forecastLocal time7-day forecastThis weekToday10%14°22°Fri10%14°22°Sat10%14°22°Sun10%14°22°Mon10%14°22°Tue10%14°22°Wed10%14°22°Rain probabilityLow ━━━ HighHourly forecastNext 8 hoursNow20°0%14:0020°0%15:0020°0%16:0020°0%17:0020°0%18:0020°0%19:0020°0%20:0020°0%Today's highlightsAt a glanceWind speed8 km/hHumidity64%UV index2.8Sunrise & sunset06:42 · 19:18MadridSpain

Atmos

03

Real weather. A clearer outlook.

A weather dashboard connecting city search and forecasts through the Open-Meteo API.

  • React
  • TypeScript
  • REST API
Open live site
Inside the project

The brief

Make it easy to browse weather data for locations around the world using an external API.

The implementation

City search, hourly and seven-day forecasts, Celsius/Fahrenheit switching and locally saved places. Loading, empty and error states include a retry path.

The result

A working API integration with request cancellation, timeouts and response validation. Saved cities stay in the same browser; the animated preview uses illustrative weather data.

CSV Cleaner/ SMALL TOOLSYour files stay on your device.LESS CLUTTER. BETTER DATA.A fresh start for your data.Remove duplicate rows. Keep what matters.✓ 100% local processing01 Your fileDrop your CSV hereor browse filesUTF-8 · up to 5 MBCSVcontacts.csv12 rows · 5 columnsTry a sample file ↗Column separatorComma (,) ⌄02 Cleaning rulesMatch duplicates by● Entire row○ Selected columnsKeep the first occurrenceClean dataOriginal rows—Before cleaningDuplicates removed—Ready when you areClean rows—Ready for your next step03 Data previewAwaiting a fileOriginalCleanedGood data starts here.Add a CSV to preview your rows.#NameEmailCompanyCityStatus1Ava Thompsonava@example.comNorthstarLondonActive2Noah Williamsnoah@example.comFormaAmsterdamActive3Mia Chenmia@example.comStudio EightSingaporeLead4Ava Thompsonava@example.comNorthstarLondonActive5Oliver Martinoliver@example.comFieldworkParisActive6Sofia Garciasofia@example.comOrbitBarcelonaLead7Noah Williamsnoah@example.comFormaAmsterdamActive8Ethan Brooksethan@example.comGoodkindAustinActive9Isla Wilsonisla@example.comNorthstarLondonLead10Mia Chenmia@example.comStudio EightSingaporeLead11Lucas Brownlucas@example.comFieldworkBerlinActive12Sofia Garciasofia@example.comOrbitBarcelonaLead↓ Export CSVLooking good? Take it with you.✓ 8 unique rows. Ready to export.4 exact duplicates removedCSVcontacts.csvCSVcontacts-cleaned.csv✓ 8 rows exportedCSV Cleaner / Animated demonstrationDrop. Clean. Export.

CSV Cleaner

04

Less repetition. Cleaner data.

A browser tool to find duplicate rows, inspect the results and export a cleaned CSV.

  • JavaScript
  • CSV processing
  • Vite
Open live site
Inside the project

The brief

Remove repeated records without sending a user’s files to a server.

The implementation

Compare entire rows or selected columns, keep the first or last match, preview removed records and export the full cleaned dataset.

The result

Local processing with configurable separators and validation. The included 12-row sample becomes 8 rows after removing 4 duplicates. Supports files up to 5 MB and 50,000 records.

HOW I CAN HELP

A clear task.
A considered solution.

Focused web work, with the scope agreed before development begins.

01

Websites & landing pages

Responsive pages, new sections and straightforward interactions.

02

Frontend fixes

Layout issues, mobile menus, forms and the details that make an interface work.

03

API interfaces & browser tools

Useful views of external data and small tools for repetitive tasks.

HOW WE’LL WORK

Clear steps.
No guessing.

A straightforward process for a focused project. We can work through the details in writing.

  1. 01

    Define the task

    Send your idea, a link, or a list of issues. We agree on the scope, deliverables, and timeline before work starts.

  2. 02

    Build & review

    I share a working preview so you can try it on your devices and give feedback while the work takes shape.

  3. 03

    Check & hand over

    We review the agreed result. I check the key interactions and screen sizes, then hand over the files and setup notes.

THE PERSON BEHIND THE WORK

I’m Anatolii.
Let’s keep it simple.

I focus on small, well-defined web projects: a page to build, an interface to improve, or a task to simplify.

The four projects above are self-initiated demonstrations, not client commissions. Each explores a practical task, from responsive layouts to working with data.

We can work through written messages: share the task, agree on what’s included, and review the result together.

HAVE A SMALL PROJECT IN MIND?

Let’s make
something useful.

Send a short brief, a link or a screenshot. Written communication works best.