Hi, I'm
Sung Woo.

Full-stack Web Developer.

Tech, Design Enthusiast.

Welcome to my site.

PS: Sung Woo (pronounced exactly like it's written) is my first name.

About Me

I'm a full-stack developer with a strong focus on Javascript, Typescript, and Python.
I started my programming journey after reading something the "wisest man on earth" once said:

"Do you see someone skilled in their work? They will serve before kings; they will not serve before officials of low rank."

I took that as a personal challenge.

I started to study Javascript, web app development, branding, marketing, and ultimately:

how to create useful things and design them thoughtfully.

My Stack

Linux & Git, and project management tools experience are implied in the job title.

Frontend

React, Gatsby, Next.js, Vue, Svelte


UI Libraries - Styled Components, Chakra UI, Material UI,
Ant Design, Bootstrap, Ionic, etc...

Backend

Javascript - Express, Koa, Apollo for GraphQL


Python - Django, FastAPI, Flask


Honorable Mentions - C++ with Qt, Java, PHP, Swift


Animation Libraries

GSAP, Framer, Lottie, three.js

Databases

Postgres, MySQL, MongoDB, Redis, and their AWS variants

Deploy & Build Tools

AWS CodePipeline / CodeBuild, Jenkins, Heroku, Render, Netlify, Surge


Vite, Parcel, Webpack, Babel (if you care)

CMS & Cloud Platforms

CMS - Strapi, CraftCMS, Sanity, Decap (formerly Netlify CMS), Django Rest API


Platforms - Netlify, Heroku, Vercel, Shopify, WordPress, Squarespace

AWS

Elastic Beanstalk, S3, Cloudfront, EC2, Route 53, Lambda, IAM, CodeBuild, CodeCommit, etc...

Favorite Party Tricks

Frontend - Set negative margin & box shadow to safely override paddings set by layout components


Backend - When using a framework or CMSaaS, install the GraphQL plugin, make middlewares, and save 160 hours of dev time


Everyday Life - Searing steaks. Building a rock solid Old Fashioned

Projects

Here's some projects I've worked on. Place the cursor/tap on each project to see more details!

BIGGBY COFFEE - Mobile App

BIGGBY

Scope: Full-stack. App architecture, UX design, backend servers, cloud DevOps, native mobile app code, leading the dev team

Favorite Feature: Custom OAuth PKCE flow handling done in a React page. Not gonna lie, I haven't seen it anywhere else.

Biggest challenge: The "tech lead" before me shouldn't have been tasked with architecting the entire app. The app and backend servers weren't built to scale well initially, so rewriting big services and porting them out of monolithic backends into microservices was giant undertaking.

Technologies Used: This app is one giant AWS soup in the backend.

React Typescript Styled Components Bootstrap Jest Express Python Django GraphQL S3 Cloudfront React Elasticache Elastic Beanstalk RDS

S & C Plastic Coating

S&C

Scope: Start to finish

Favorite Feature: The services pages where GSAP's ScrollMagic and 3D videos were used to create a UX where a video plays as you scroll, inspired by Apple's AirPods page UX.

Biggest challenge: I got the honor of building all the 3D animations in Blender.

Technologies Used: I hold an unpopular opinion that Gatsby is better than Next.JS for small business websites.

React Gatsby GraphQL Decap Netlify Blender

V3 Distribution

V3

Scope: Start to finish

Favorite Feature: Every section tag is a customized template that can be selected & modified from the Strapi CMS. This allows for highly customizable UI despite having a static and template-driven architecture.

Biggest challenge: Ever messed with Hubspot forms & React? Or making the Hubspot tracking script not tank your Lighthouse score?

Technologies Used:

Gatsby GraphQL S3 Cloudfront Hubspot React Netlify Postgres Strapi Heroku

Vista IT Group

V3

Scope: Post-production maintenance, redesign, security updates

Favorite Feature: There are certain pages where fully dynamic Javascript mini-apps take over the UI in the Magento templates.

Biggest Challenge: The damn site was built with Magento.

Technologies Used:

Magento CloudFlare Hubspot Javascript

DropDrop

Scope: Post-production maintenance & component extension

Favorite Feature: This React project was shipped with a customizable server-side rendering Node.js application. Built with futureproofing, additional customizations were effortless. Props to the guys at TRBL.

Biggest Challenge: Sticking to a comprehensive & rigid branding system while extending compoents & UI features.

Technologies Used:

NodeJS Wordpress React Hubspot

Michigan Psychological Care

*** This project has been handed off & modified in 2021.
Scope: Start to finish

Favorite Feature: The overall theme & design system was very pretty. Working with Gatsby and its GraphQL engine is always a treat.

Biggest Challenge: The design files had some... interesting... components that weren't checked by a UI/UX designer before being delivered for development. Had to improvise on those.

Technologies Used:

React Netlify Postgres Strapi Heroku Gatsby GraphQL S3 Hubspot

Room 9 Design

Scope: Start to finish

Favorite Feature: The strong, bold blackletter brand assets make this highly minimal website POP.

Biggest Challenge: The vanilla Javascript & CSS animations of the moving blackletter quotes in the background of the content pages was a project on its own. That was a mouthful.

Technologies Used:

JavascriptReact Next.JS Vercel Framer

Hastings Design Company

Scope: Start to finish

Favorite Feature: Next.JS architecture + sassy branding + vintage fonts = excellent project.

Biggest Challenge: The website's SERVERLESS contact form processor & email autoresponse app.

Technologies Used:

JavascriptReact Next.JS Vercel Cloudinary Cloudinary Cloudinary

sungwoo.io

sungwoo.io

Scope: Start to finish

Favorite Feature: This website is hugely minimalistic. No JS frameworks, no Typescript, and not a single loop/map function. Some might even call it "old school".

Biggest Challenge: Can you figure out how I made the hover/click feature? Hint: think backwards!

Technologies Used:

html css Javascript Render gsap

Junia & Co

Scope: Start to finish

Favorite Feature: This project is almost 100% serverless.

Biggest Challenge: This business is my wife's business.

Technologies Used:

React Vue Strapi Gatsby GraphQL S3 Snipcart

MudPenny

Scope: Landing page development, custom development

Favorite Feature: The branding, beautiful photos & video for messaging.

Biggest Challenge: The native Squarespace Tock widget struggles with handling custom fonts & responsiveness. Injecting the "right" CSS to fix that was a struggle.

Technologies Used:

Squarespace HTML CSS Javascript

Earnest Machine Products

Scope: WordPress development, Elementor Pro, custom development

Favorite Feature: When Earnest Machine reached out, the website was full of plugins and custom code that was outdated and difficult to use. We took some time to revamp the site with Elementor Pro. The website became a 95% no-code platform.

Biggest Challenge: Consolidating WordPress plugin versions, figuring out which problems are from custom code and which are from bad configuration.

Technologies Used:

WordPress Javascript PHP HTML CSS Elementor

Contact

I'm always looking for contracts, projects, and opportunities to get to know people. Shoot me a message!