컴퓨팅 사고와 개발 실력 늘리는 법

컴퓨팅 사고란

컴퓨팅 사고(Computational Thinking) 는 문제를 컴퓨터가 효과적으로 수행할 수 있는 형태로 정의하고 답을 기술하는 사고 과정이다. 지넷 윙(Jeannette Wing)이 2006년 글에서 이 말을 널리 알렸다. 계산하는 주체가 사람이든 기계든 실행할 수 있게 문제와 해법을 표현하는 능력이라, 프로그래머만이 아니라 누구나 갖출 기초 소양으로 본다.

네 가지 구성 요소

여기에 만든 절차를 실제 프로그램으로 돌리는 자동화를 마지막 단계로 붙이기도 한다. 블록 코딩으로 사람 그림을 그리는 예가 이 흐름을 잘 보여 준다. 머리부터 발끝까지 한 번에 그리면 코드가 길고 고치기 어렵다. 팔과 다리가 같은 모양이라는 패턴을 찾아 함수 하나로 만들고 크기를 인자로 받게 하면, 같은 함수로 여러 사람을 그린다. 패턴 인식은 함수(재사용)로, 추상화는 매개변수로 이어진다.

데이터의 관점으로 보기

컴퓨터는 0과 1, 곧 숫자만 다룬다. 그래서 컴퓨터의 관점으로 본다는 것은 데이터의 관점으로 세상을 보는 것이다. 개발은 사람의 요구사항을 계속 변하는 값, 즉 데이터의 형태로 바꾸는 일이다.

// "불을 켜고 끈다" → 상태 하나와 그 상태를 바꾸는 두 함수
let isLight = false
const turnOn = () => { isLight = true }
const turnOff = () => { isLight = false }

사람은 불을 켜면 켜진 것을 당연히 안다. 컴퓨터는 켜짐을 직접 인식하지 못하므로 반드시 값으로 표현해야 한다. 이 번역을 의식하면서 하는 것이 컴퓨팅 사고의 출발이다.

데이터 → 구조 → 알고리즘 → 추상화

filter의 본질은 "조건에 맞는 요소만 거른다"이다. 반복문과 push 같은 세부는 밖으로 드러낼 필요가 없다. 자동차를 운전할 때 엔진 구조를 몰라도 핸들과 페달만 알면 되는 것과 같다. 데이터로 보는 것이 출발이라면, 추상화를 이해하고 쓰는 것이 다음 단계다.

결국 프로그래밍의 핵심 요소는 언어가 바뀌어도 같다. 변수, 타입, 조건, 반복, 함수로 데이터의 구조와 알고리즘을 표현한다.

알고리즘으로 적기

문제 해결 절차

1. 문제 정의: 무엇이 주어지고 무엇을 내야 하는지, 입력과 출력을 분명히 적는다. 여기가 흐리면 알고리즘도 흐려진다.
2. 설계: 분해·패턴 인식·추상화를 거쳐 해법을 만든다.
3. 표현: 아래 방법 중 하나로 절차를 적는다.
4. 구현과 검증: 코드로 옮기고 경계 사례로 시험한다(코딩 테스트 접근법).
5. 분석: 다른 해법과 시간·공간을 비교한다(빅오 표기법). 비교 기준(정확성·효율성 등)은 그 노트의 「알고리즘이란」에 있다.

알고리즘을 적는 네 가지 방법

「임시 변수 tmp로 x와 y의 값을 맞바꾼다」 같은 절차도 적는 방법에 따라 성격이 달라진다.

설계 단계에서 가장 쓸모 있는 것은 의사 코드다. 코딩 전에 생각을 정리하고, 리뷰 때 핵심 논리만 놓고 이야기할 수 있다. 순서도는 도형에 뜻이 정해져 있다. 둥근 사각형은 시작·끝, 평행사변형은 입출력, 직사각형은 처리, 마름모는 조건 분기다.

swap(x, y):
    tmp ← x
    x ← y
    y ← tmp

세 가지 제어 구조

어떤 알고리즘이든 순차·선택·반복 세 구조의 조합으로 적을 수 있다(뵘-야코피니 정리). 이 셋만으로 프로그램을 짜자는 규율이 구조적 프로그래밍이다.

def largest(nums):          # 순차
    best = nums[0]
    for n in nums[1:]:      # 반복
        if n > best:        # 선택
            best = n
    return best

알고리즘 공부가 필요한 이유

알고리즘은 자료구조를 바탕으로 문제를 푸는 절차이고, 알고리즘을 배운다는 것은 지금까지 찾아낸 가장 효율적인 풀이를 배우는 것이다. 기준은 기계 성능이 아니라 입력이 늘 때 시간이 얼마나 늘어나는지, 즉 시간 복잡도(Big-O)다.

현실의 방식을 그대로 본뜬 풀이가 비싸면, 더 컴퓨터스럽게 생각해 최적화하는 법을 배우는 것이 알고리즘 공부다.

프론트엔드 개발자에게는

실무에서 프론트엔드가 알고리즘을 직접 짤 일은 드물다. 그래프보다 복잡한 자료구조를 쓰는 경우도 많지 않다. 디자이너가 포토샵 내부 구현을 몰라도 되듯, Array.prototype.sort()의 내부를 몰라도 쓸 수 있다. 프론트엔드는 오히려 최적화보다 가독성과 사람에 가까운 코드를 중시한다. 그래도 공부가 필요한 이유는 둘이다.

1. 요구사항을 String·Array·Object로 만드는 감각이 길러진다. 문제를 이미 알려진 자료구조의 세계로 끌고 오면, 그 세계의 문법으로 보고 이미 해결된 방법으로 풀 수 있다. 자료구조와 알고리즘은 컴퓨터와 소통하는 언어다.
2. 프론트엔드에도 최적화가 필요한 순간이 있다. 이때는 알고리즘 목록보다 최적화 원리(분할 정복, 동적 계획법, 탐욕법)가 쓸모 있다. React의 useMemo도 동적 계획법의 메모이제이션이다.

프론트엔드 실무에서 자료구조·알고리즘이 드러나는 자리는 다음과 같다.

원리를 알면 언어나 플랫폼이 바뀌어도 빨리 적응한다. 응용 기술은 기초 기술 위에 서 있으므로, 쓰는 도구를 떠받치는 기반을 알아 두면 특정 환경에 묶이지 않는다.

어디까지 깊게 팔지는 전략적으로 정한다. 사전처럼 알고리즘을 외우기보다 "현실 문제를 어떻게 데이터로 보고 어떻게 최적화하는가"를 익힌다고 생각한다.

코딩 테스트의 의미

코딩 테스트 문제는 특정 언어·라이브러리에 묶이지 않는다. 실무 능력이 아니라 지문을 읽고 알맞은 자료구조와 알고리즘을 찾는 능력, 즉 컴퓨팅 사고를 보기 때문이다. 취업 준비 때 제대로 공부해 두면 좋다. 입사 후에는 동기가 잘 안 생긴다. 다만 시간 제약이 있는 평가 도구라, 실무에 필요한 디자인·일정·협업·보안·유지 보수는 다루지 않는다. 실력을 키우는 주 훈련으로 삼기에는 부족하다. 코딩 테스트 준비법은 코딩 테스트 접근법에 있다.

개발은 학문이 아니라 운동이다

축구 교재와 경기 영상만 봐서는 공을 잘 찰 수 없다. 개발도 직접 해 봐야 늘고, 한 번에 늘 수 있는 폭에 한계가 있어 꾸준함이 중요하다. 무작정 실전만 하면 나쁜 습관이 붙으니 공부와 훈련을 병행하되, 처음에는 실전 비중이 훨씬 커야 한다. 실력이 오르면 다양한 경험과 넓은 시야가 중요해진다. 팀 스포츠처럼 협업과 내 포지션에 대한 이해도 실력이다.

• 도구 숙련도와 본질은 다르다. React를 잘하면 Vue도 금방 한다. 잘하는 개발자는 무엇을 해도 잘한다.
• 많이 아는 것과 잘하는 것은 다르다. 면접에서 잘 대답한 사람이 실무에서 못하는 일이 생기는 이유다.

훈련 방법: 베끼고, 돌리고, 고치고, 합친다

flowchart TB
  n1["목표 정하기"] --> n2["가장 비슷한 남의 코드 찾기"]
  n2 --> n3["일단 내 환경에서 돌리기"]
  n3 --> n4["숫자·문자를 바꿔 가며 내 것으로 고치기"]
  n4 --> n5["다른 코드와 결합하기"]
  n5 --> n6["반복해서 완성"]

1. 만들고 싶은 것부터 정한다. 개발은 기술로 가치를 만드는 일이라 만들지 않으면 의미가 없다. 모르겠으면 책의 예제라도 "만든다"를 목표로 삼는다.
2. 돌아가는 남의 코드를 가져와 일단 돌린다. 분석은 나중이다. 에러는 검색이나 AI에 물어 해결한다.
3. 고쳐서 내 것으로 만든다. 보이는 값을 바꿔 가며 변화를 느끼면 맥락이 잡힌다. 목적이 있을 때 공부한 것은 빨리 내 지식이 된다. 처음부터 다 이해해야 넘어가겠다는 생각이 가장 큰 방해물이다. 띄엄띄엄 배워도 된다.
4. 결합한다. 원하는 코드가 100% 있을 리 없다. 서로 다른 코드를 합치는 과정에서 대부분의 문제가 생기고, 그때 얻는 지식이 오래 남는다. 바퀴를 다시 발명하지 말고 필요한 부분만 이해해 조립하는 것, 이것이 추상화이자 개발의 공유 문화다.
5. 반복해서 완성한다. 위태롭게 쌓은 코드도 조금씩 안정된다.

의식적으로 생각하며 훈련한다

run & fix만 반복하며 직관에 기대면 어느 지점에서 성장이 멈춘다. 의식적으로 연습하면 나중에는 실전에서 직관에 맡겨도 컴퓨팅 사고가 자동으로 작동한다.

문제 해결의 사고 습관

기술을 아는 것과 문제를 푸는 것은 다르다. 같은 지식으로도 어떤 각도에서 문제를 보느냐에 따라 해법의 비용이 크게 달라진다.

정리

• 컴퓨팅 사고는 분해·패턴 인식·추상화·알고리즘으로 문제를 실행 가능한 절차로 바꾸는 것이고, 그 출발은 사람의 요구사항을 데이터의 관점으로 다시 정의하는 것이다.
• 알고리즘은 자연어·순서도·의사 코드·코드로 적을 수 있고 설계 단계에서는 의사 코드가 가장 실용적이다. 모든 절차는 순차·선택·반복의 조합이다.
• 알고리즘 공부의 가치는 알고리즘 목록이 아니라 데이터로 사고하고 최적화하는 법을 익히는 데 있다. 프론트엔드 개발자에게도 그렇다.
• 개발은 운동처럼 훈련으로 는다. 목표를 정하고, 남의 코드를 돌리고, 고치고, 합치는 과정을 반복한다.
• "일단 뭐든 만들어 보되, 생각은 하면서."

관련 노트: 코딩 테스트 접근법, 빅오 표기법과 시간 복잡도, 프로그래밍 패러다임, 초보 웹 개발자의 공부 방향과 차별화, 사이드 프로젝트를 시작하고 끝까지 가는 10가지 팁, 프론트엔드 개발자의 업무 범위와 역량, 개발 자료 잘 찾는 법, 개발자의 지속 가능한 학습 루프