ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 초코의 풀스택 도전기 1: 초보 코더 초코의 이야기 - 풀스택(Full Stack)이란 무엇일까?
    스토리텔링 2024. 8. 11. 22:47

    서론

    저는 다른 전공을 하다가 프로그래밍 세계로 들어오면 이 과정에서 풀스택, 프론트엔드, 백엔드 같은 용어들을 처음 접하게 됩니다. 용어의 의미를 정확히 이해하는 것이 참 어렵더라고요. 특히 이런 개념들이 실제로 어떤 역할을 하는지 감을 잡기 어려웠습니다. 
     
    그래서 이 글을 통해 저와 같은 고민을 가진 분들, 특히 프로그래밍 용어가 익숙하지 않은 분들이 풀스택 개발자가 하는 일이 무엇인지, 프론트엔드와 백엔드와 어떤 차이가 있는지 쉽게 이해할 수 있도록 재미있는 스토리 형식으로 풀어내서 용어와 개념이 자연스럽게 다가오도록 만들어드리겠습니다.
     
    저와 함께 초코(초보 코더의 줄임말)의 풀스택 개발자 여정을 따라가 보면서, 용어와 개념을 하나하나 익혀봅시다. 함께 배워나가길 기대합니다!

     

    챕터 1: 코딩 숲의 초입

    초코는 원래 전혀 다른 일을 하고 있던 평범한 직장인이었다. 하지만 어느 날, 그는 새로운 길을 걷기로 결심했다. "풀스택 개발자가 뭐지?" 어느 날 친구의 말을 듣고 호기심이 생겼다. "프론트엔드와 백엔드를 다 할 수 있으면 더 많은 기회를 얻을 수 있지 않을까?"
     
    이렇게 해서 초코는 프로그래밍의 세계에 발을 들였다. 풀스택 개발자가 되기 위해서는 프론트엔드와 백엔드, 이 두 세계를 모두 이해해야 한다는 사실을 알게 되었다. 그래서 초코는 두 가지 모두 탐험하기로 했다.
     

    챕터 2: 프론트엔드 – 사용자와 마주하는 첫 번째 문

    프론트엔드는 웹사이트에서 사용자가 가장 먼저 만나는 부분이었다. 초코는 HTML, CSS, 그리고 JavaScript라는 강력한 도구들을 사용해 웹사이트의 구조를 만들고, 그 구조를 아름답게 꾸미며, 사용자와 상호작용할 수 있게 만들었다.
     
    HTML은 건물을 짓는 설계도처럼 페이지의 뼈대를 구성했다. CSS는 그 위에 예쁜 디자인을 입혔다. 하지만 진정한 마법은 JavaScript에서 나왔다. JavaScript는 페이지에 생명을 불어넣고, 사용자와의 상호작용을 가능하게 했다. 예를 들어, 버튼을 누르면 창이 열리고, 폼에 데이터를 입력하면 그 정보가 즉시 화면에 반영되는 것이다.
     
    "프론트엔드는 사용자에게 직접 보이는 부분을 책임지는 거구나," 초코는 깨달았다. 사용자가 클릭하고, 스크롤하고, 입력하는 모든 동작을 부드럽고 직관적으로 만들어주는 것이 바로 프론트엔드 개발자의 역할이었다.
     

    챕터 3: 백엔드 – 보이지 않는 곳에서 모든 것을 움직이는 힘

    하지만 웹사이트의 겉모습만 예쁘다고 끝나는 것이 아니었다. 초코는 웹사이트가 잘 작동하기 위해서는 뒤에서 모든 것을 처리해주는 백엔드 시스템이 필요하다는 것을 알게 되었다.
     
    백엔드는 마치 보이지 않는 세계의 거대한 기계 같았다. 데이터베이스, 서버, 그리고 API들이 이 세계에서 움직였다. 백엔드의 첫 번째 핵심은 API(Application Programming Interface)였다. API는 프론트엔드와 백엔드가 서로 소통할 수 있도록 해주는 다리와 같았다. 예를 들어, 사용자가 로그인하면, 프론트엔드에서 API를 통해 서버로 데이터를 전달하고, 서버는 그 데이터를 확인한 후 결과를 다시 API를 통해 프론트엔드로 보내는 식이다.
     
    다음으로, 데이터베이스(Database)가 등장했다. 데이터베이스는 웹사이트의 '기억 저장소'였다. 사용자가 회원가입을 하면 그 정보는 데이터베이스에 저장되고, 나중에 로그인할 때 그 정보를 불러올 수 있었다. 초코는 MySQL 같은 관계형 데이터베이스와 MongoDB 같은 비관계형 데이터베이스의 차이도 배웠다. 관계형 데이터베이스는 테이블로 데이터를 저장하고, 비관계형 데이터베이스는 유연하게 데이터를 저장할 수 있었다.
     
    서버(Server)는 클라이언트와 데이터베이스 사이에서 정보를 주고받는 심장 역할을 했다. 초코는 Node.js와 Express.js를 사용해 서버를 만들고, 데이터를 주고받는 과정을 자동화했다. 이 과정에서 보안과 성능 최적화가 얼마나 중요한지도 배웠다.
     

    챕터 4: 풀스택 개발자의 여정

    이제 초코는 프론트엔드와 백엔드의 세계를 모두 탐험했다. 프론트엔드에서 사용자의 경험을 향상시키고, 백엔드에서 데이터를 처리하고 저장하는 모든 과정을 이해하게 되었다. 풀스택 개발자는 단순히 양쪽 세계를 넘나드는 기술자가 아니라, 전체적인 시스템을 이해하고 최적화할 수 있는 '종합적 기술자'라는 것을 깨달았다.
     
    초코는 이 여정을 통해 자신이 단순한 코더가 아니라, 문제를 해결하고 시스템을 만들어가는 개발자가 되어가고 있음을 느꼈다. 그리고 그는 자신의 경험을 블로그에 기록하며, 더 많은 초보 코더들이 이 길을 쉽게 걸을 수 있도록 돕기로 결심했다.

     

     

    다음 편에서 : 초코의 풀스택 도전기 2: 프론트엔드의 문을 두드리다 - HTML, CSS, JavaScript를 만나다

     

    초코의 풀스택 도전기 2: 프론트엔드의 문을 두드리다 - HTML, CSS, JavaScript를 만나다

    풀스택 개발의 전반적인 개념을 어느 정도 이해한 초코는 드디어 프론트엔드 세계의 문턱에 섰다. 초코의 목표는 사용자에게 보이는 웹사이트의 외관을 만들고, 그들이 어떻게 경험하는지 이해

    ethub.tistory.com

     

Designed by Tistory.