Woowa Tech Camp 3rd Review

A 2021 review of a camp that ended in August 2020 is a bit late, I know. But the 4th recruitment is open right now, and if I don't post this now I probably never will. Most of what's online only skims the surface, so I'll stick to the things I was curious about when I applied.

Woowa Tech Camp is a summer programming course where you intern at Woowa Brothers, the tech unicorn behind Baedal Minjok (배달의민족, a.k.a. Baemin), and learn how real development works. 30 people get in. Competition is about 43 to 1.

No shoes allowed. The so-called Sushi Bar Lounge, first come, first served because of the view.

🔋 Selection Process

Application

Each question had a 700-character limit.

• What do you think are the virtues of a developer, and in light of this, what aspects of yourself do you think make you suitable to work as a developer?
• Please freely describe why you want to participate in Woowa Tech Camp.
• If you have your own programming learning method outside of the curriculum, please describe it.
• Describe an experience where you faced difficulties in the collaboration process and what efforts you made to overcome those difficulties.

1st Coding Test

Typical coding test problems. I solved them in JavaScript, I think. I'd been grinding tests for Programmers Summer Coding and Woowa Tech Camp at the time, so it wasn't too bad. 4 problems, 150 minutes.

2nd Coding Test

Build an admin tool with specific features in their VS Code web environment. Boilerplate, build, and CI/CD were already there, so you could get it running right away from the README, and we had to build 3 core features on top. No external libraries, vanilla JS only. 4 hours sounds long, but it wasn't enough for me. I'll skip the details, since the staff said they couldn't be shared... 😭

Interview

30 minutes online, because of COVID-19. Not a hiring interview, so instead of deep technical questions they mostly checked whether we had solid programming basics, were ready to learn at camp, and would be good campmates. I'd mentioned this blog in my application, so they asked a lot about one specific post.

Competition Ratio

I was curious about the competition too. Here's what I found out later.

• Total applicants: 1300+ (43+ times)
• Passed application and 1st coding test: 500+ (17+ times)
• Passed 2nd coding test: 90 (3 times)
• Passed interview and final acceptance: 30

🏫 Curriculum

0. Orientation Period (3 days)

• Mini Project: Implementing a web server without Express and HTTP.
• Study Keywords: Node.js, JS OOP, Asynchronous Programming, Async Cafe, HTTP Specification, HTTP Basics.
• Our Team's GitHub
• My Blog Post

The Small House, where the orientation took place. It's in Jamsil.

1. Baemin Mart Project implementing login (1 week)

• Conditions
  • Use only vanilla JavaScript.
  • Implement authentication directly without using authentication systems like Passport.
  • Implement the DB directly using the file system without using a commercial DB.
• Study Keywords: HTML, CSS, CSS Layout, Express.
• Our Team's GitHub

The Big House, the main stage of Woowa Tech Camp. A 12-second walk from Mongchontoseong Station.

2. Trello Project directly implementing a Kanban board (2 weeks)

• Conditions
  • Use only vanilla JavaScript.
  • Directly configure and utilize Webpack.
  • Drag & drop must be implemented, but it should be done directly using event bubbling, event capture, and event delegation without the HTML Drag and Drop API.
• Study Keywords: Webpack, ES Module, DOM API, Templating, Fetch-Promise pattern, JS Event Delegation, DBMS, MySQL, SQL Syntax.
• Our Team's GitHub

The cafe on the 18th floor of the Big House and the view of Olympic Park from the cafe.

3. Bank Salad Project directly implementing a household ledger app (2 weeks)

• Conditions
  • Use only vanilla JavaScript.
  • Directly implement a single-page application using vanilla JavaScript and the History API.
  • Implement CI/CD directly without using commercial solutions.
  • Implement OAuth.
  • Draw graphs using SVG, canvas, etc.
• Study Keywords: Observer Pattern, ERD, OAuth, Passport, State Management, Immutability, Transactions, Shell Scripts, CI/CD, CSS Animations & Optimizations (requestAnimationFrame & requestIdleCallback), SVG, Canvas.
• Our Team's GitHub

We occasionally did pair programming. The code you see now is...

4. B Mart Project directly implementing Baedal Minjok's B Mart (3 weeks)

• Conditions
  • Use Vanilla React.
  • Utilize AWS VPC.
  • Utilize S3 image storage.
  • Utilize the Elastic Search, Logstash, Kibana (ELK) combination.
• Study Keywords: React Hooks, AWS VPC, React Router, React Context API, React useReducer, AWS IAM, AWS S3, React Test Codes (Jest, Enzyme, ...), Elastic Search, Logstash, Kibana, ELK.
• Our Team's GitHub

✨ The Good Parts

First, we got a stipend of about 1.5 million won a month, plus gear (a MacBook Pro 💻 and a monitor 🖥).

Everyone got a loaner 2019 16-inch MacBook Pro, the high-end i9 model. 16GB RAM, 1TB SSD, Radeon 5500M 4GB GPU. At the time of the 2020 camp, that was the highest spec you could get without CTO. One ThinkVision QHD monitor for every two people, 15 in total. I thought that wouldn't be enough, but there were plenty.

👨‍💻 What the heck is (for beginners) good code?

// Load activity log to right sidebar
async function addActivityLogToActivityLogList() {
  let activityLogList = document.getElementById("activity-log-list");
  activityLogList.classList.add("activityLog");
  activityLogList.innerHTML = "";
  let userList = await api.User().getAllUsers();
  userList.reverse();
  console.log("There are currently [", userList.length, "] users.");
  userList.forEach((user) => {
    let activityLog = document.createElement("li");
    activityLog.classList.add("activityLog");
    let date = new Date(moment(user.created_at).format("YYYY-MM-DD HH:mm:ss"));
    activityLog.innerText = user.userId + " joined on " + date;
    activityLogList.appendChild(activityLog);
  });
}

The original code can be found here.

Uh - this is not in a state to be reviewed. Who wrote this? Let's have a talk.

That was the feedback on my code, picked at random and put up on the screen at the code review session on Friday afternoon, July 25th, at the end of the 2nd project. I thought I'd handled the brutal time pressure pretty well and built a page that worked fine. Getting hit that directly was a shock. Text doesn't do it justice, but the room went completely frozen.

I thought about a million things on the train home that day. Once I calmed down, I realized a camp that just said "Okay, okay~ we all did great and worked hard~" wouldn't be a good camp. A workbook needs problems you get wrong. So I decided to lean on what I was relatively good at and soak up as much as I could in the month left.

Juniors studying programming hear "clean code, good patterns" all the time. From a beginner's point of view, hearing it that often makes you repeat it on autopilot, like memorizing, with no real sense of what good actually looks like. Looking back at that code

• It does two jobs at once, ① fetching information and ② displaying it. Tight coupling, and tight coupling means major surgery when you need to swap out part of it later.
• Logic and view are mixed all over the file. Hard to read.

After that advice, I paid a lot of attention to these patterns from the 3rd project on. I turned part of it into a mini-project, which should give you a feel for it.

• Creating a Calendar with Vanilla JS

🛷 Dunning-Kruger Sledding

A bit of a cliché, but I got to experience the peak of ignorance firsthand. I never thought I knew everything, but I'd done a fair number of JavaScript projects, so I dared to think, "Sure, I'll have to work hard, but I can probably keep up without too much trouble, right?"

Of course, the camp was extremely hard. The curriculum was designed to put constraints on each project and then let you fix what those constraints made painful in the next one. Auth without Passport, then finally Passport. The flip side is this happened every 1 to 2 weeks. The moment you barely got the hang of one technology, you were on to the next and climbing a steep learning curve all over again.

It felt like sledding down the Dunning-Kruger curve. I wasn't fluent enough in JavaScript to do whatever I wanted with it, so I really had to grind to keep up.

🌎 What does it mean to know in the internet age?

I also thought a lot about what it means to know something when you can just search it. For programming at least, I think I found part of an answer. I call it GSPH, Googling Sessions Per Hour. A Googling Session is a deep search that takes more than 5 minutes. For example, if you couldn't remember the name of a JavaScript property function and completed the search in 2 minutes, it wouldn't count. If OAuth doesn't come to mind easily and you have to look at the documentation for 10 minutes, it would count.

At roughly 3 or fewer an hour while doing a task, I think you can say you know the concept. Quick searches in the middle of a task don't mean you don't know it. Looking up every single step means you need to study more.

👾 Library ≠ Alien Technology

Frameworks and libraries sometimes get treated like alien technology. Sure, well-known ones are collections of proven, efficient code. Treating them as untouchable alien tech and leaving every decision to the library is a bit dangerous.

Web libraries in particular are built on plain JavaScript, the same JavaScript we write. The camp kept stressing that instead of blindly relying on external libraries, we should know how they work and where they could go wrong. If it came to it, you should understand a library well enough to build something like it yourself.

Libraries are Terran 🧑‍🔧 technology, not Protoss 👽 technology.

Take the left-pad incident from 2016. An 11-line library called left-pad was pulled from npm, the dependency chain fell like dominoes, and the babel transpiler stopped working. Wasn't that also a case of leaning way too hard on simple code anyone could write in a few minutes?

As a hobby developer you might think, "Huh? Babel is super reliable, hundreds of thousands of people use it. I should worry about my own code instead." But for a company that loses a fortune when the service is down for even 30 minutes, this matters. Libraries aren't unknowable alien tech, and they're not something to pray to. They're services that can break at any time.

🥳 Fun Experiences

🧩 Crawling Baemin's Image Server

While building the final B Mart service, we needed a ton of Baemin's B Mart data, mostly photos to fill the image slots so it would feel like the real app. Drawing on my previous experience, I scraped the image resources off Baemin's server (with the staff's permission).

Strictly speaking the images sit on an open CDN, so this isn't hacking Baemin's server. The catch is the endpoints and image addresses are hidden in a way you can't just guess.

http://CDNdomain.baemin.com/some/thing/1abcde23-very-long-alphanumeric-address.jpg

The final image CDN URI looks roughly like that, and opening it shows the image.

This wasn't shallow crawling where you open the B Mart web view and grab things with CSS selectors, and the camp didn't hand us internal server data either, so it took real effort. I intercepted the iOS Baemin app's traffic to find the endpoints and image addresses, and with a bit of CTF I worked out the list. I pulled about 1,000 images, icons, sound effects, and so on from that server and put them in a private repository for the other campers.

🏢 Whirlwind Corporate Night History

In between, we heard behind-the-scenes stories from Korean companies. How a certain game company barely uses RDBs and dumps binaries instead because hundreds of thousands of items get mass-produced. How someone once edited game DB fields to duplicate items worth hundreds of millions of won, so DB access got very strict afterward. How developers at a certain accommodation company could see every member's personal info, so for a while they freely looked up celebrity members... I'm really into how companies work, so these were fascinating.

⚡️ Synergy x Synergy = Synergy³

Still, I think the best part was meeting the other campers. I kind of got what people mean when they say the best perk is great coworkers. Above all, I want to talk about jhaemin.

At the start of each project, the camp hands out design drafts and planning docs. But they're only suggestions, and you can build whatever you want. Making the design more usable and better looking is entirely up to the campers. At first I thought the design was something you had to follow, but it wasn't. As if to hint that good coworkers are the ones who find work and do it, everything was open. Improve the design, add features, or even cut something. Great power, great responsibility.

For the design mindset of a front-end developer, jhaemin influenced me a lot. I learned so much watching him spin up usable web apps fast on his own solid design system. Look at the 2 sites that blew my mind and you'll see what I mean.

• woowa-techcamp-2020/market-6
• woowa-techcamp-2020/todo-14

Inspired, I tried redesigning things myself starting with the 3rd project, Bank Salad. Here's how I completely reworked the design ↓

What I like about my design is ① it uses the wide screen fully by splitting things into 3 columns, and ② the activity log on the right runs independently, so the contents of the right window are maintained even when freely moving to the calendar, statistics, and payment method management. Kind of like Slack?

And there was so much more to learn from people like naamoonoo who created a pseudo-React with vanilla JavaScript, pigrabbit who completed Elastic Search over the weekend, dnacu who handled React as comfortably as breathing, younho9 who quickly implemented the SPA structure and singleton pattern with just JS, 0407chan who systematically implemented the data access strategy, Jenny who finished the design structure overnight, and more.

🎬 Odds and Ends

• First time really collaborating with Git and GitHub. Solo, you rarely get to use branch and checkout properly. For Git collaboration, I think I got to GSPH < 3.
• The lectures were really good. Every Wednesday they showed interesting parts of how Baemin builds and runs its services. The lecture by developer Kim Min-tae especially stuck with me.
• Getting a taste of company life was great. Company life at 21!
• The hyungs and noonas who taught us really knew their stuff, and they were considerate of me. There were plenty of fun activities too, but sadly COVID-19 cut a lot of them.
• A truly precious experience, and I learned a ton. If my fundamentals had been a bit stronger I could have gone much deeper, so I have a few regrets there. Still, it's a real asset for whatever comes next.
• Of course I won't be perfect right away. I've been feeling the gap between ideals and reality lately. Still, if we point our compass at our ideals and keep walking, I have a little faith we'll get there someday 🧭