본문 바로가기

전체 글62

풀스택에서 프론트엔드 개발자로 보낸 3년, 그리고 새로운 시작 들어가며첫 회사에서 4년 6개월간 대입 입시 서비스를 개발하며 첫 커리어를 쌓았고, 두 번째 회사에서 프론트엔드 개발자로 3년을 보냈습니다. 이제 세 번째 회사로의 도전을 앞두고, 두 번째 회사에서의 경험을 정리해보려 합니다. 첫 회사에서는 정해진 틀 안에서 안정적인 서비스를 운영하는 법을 배웠다면, 두 번째 회사에서는 정말 다양한 프로젝트를 리드하며 많은 경험을 할 수 있었습니다. 첫 직장에서 두 번째 회사로대입 입시 서비스 회사에서의 4년 6개월첫 회사는 대입 입시 관련 서비스를 제공하는 회사였습니다. C#과 ASP.NET 기반의 레거시 시스템 위에서 일했고, 합격자 통합 관리 시스템, 원서접수 페이지, 입학상담 앱 등을 개발했습니다.안정적인 환경이었지만, 한계도 명확했습니다:정해진 입시 일정에 맞.. 2025. 10. 30.
HTML에서 AI까지: 프론트엔드 개발의 여정 웹 개발이 시작된 지 30여 년이 지났습니다.초기의 정적인 HTML 페이지에서 오늘날의 AI와 노코드 툴까지, 프론트엔드 개발은 정말 빠르게 발전해왔습니다. 이번 글에서는 시대별 흐름을 따라가며 그 진화를 살펴보겠습니다. 현재 브라우저에서는 표현이 안되는 내용들은 AI를 활용해 최대한 그때의 화면들과 비슷하게 구성해서, 이미지로 첨부하였습니다. 1990년대: 웹의 탄생과 정적 페이지 시대HTML의 등장 (1991)팀 버너스리가 HTML을 만들면서 웹의 역사가 시작되었습니다.초기 웹사이트는 단순히 텍스트와 링크 만 제공하는 정적 페이지였습니다. CSS의 도입 (1996)CSS(Cascading Style Sheets)는 콘텐츠와 디자인을 분리 하며 웹 개발의 패러다임을 바꿨습니다.당시 웹사이트는 여전히 .. 2025. 8. 26.
25.듀얼 브레인 이선 몰릭의 『듀얼 브레인: AI 시대의 실용적 생존 가이드』를 읽으며, 가장 크게 남은 문장은 단순했다.“AI는 더 이상 선택이 아니라 필수다.”AI를 대체자로 보는 것이 아니라 공동지능의 파트너, 공기처럼 항상 전제된 존재로 두어야 한다고 말한다.대신 인간은 문제 정의와 최종 판단이라는 역할에 집중해야 한다는 것이다. 개발 업무에서의 적용이 틀을 개발 업무에 적용했을 때 변화는 분명했다.코드 자동완성, 리팩터링 제안, 테스트, 오류 메시지 해석, 코드 작성 보조 덕분에 과거 퍼블리셔와 나누어 하던 퍼블리싱 과정을 이제는 혼자서도 무리 없이 처리할 수 있게 되었다. 불안과 성찰다만 불안도 있다. 시행착오를 통해 길러지던 감각이 무뎌지고 있는 건 아닐까. 실제로는 내가 깊이 고민하기보다 AI의 제안을 그.. 2025. 8. 21.
24.마음의기술 현대인이라면 누구나 불안, 우울, 부정적 감정에 휩쓸려 헤어나지 못하는 순간을 겪는다. 안-엘렌 클레르의 『마음의 기술』은 바로 이런 고통스러운 시간을 이해하고 마주하는 데 도움을 주는 책이다. 처음 책을 펼쳤을 때 마음 문제에 대한 즉각적인 해결책이나 실질적 조언을 기대했다. 그러나 책은 내 기대와 달리, 뇌의 신경과학적 작동 원리와 감정 메커니즘 같은 과학 지식을 중심으로 이야기를 풀어냈다. 낯설고 어렵게 느껴졌지만, 오히려 내 마음을 객관적으로 바라볼 수 있는 새로운 통찰을 얻게 되었다. 뇌과학이 말하는 감정의 비밀『마음의 기술』의 가장 큰 강점은 추상적인 마음의 영역을 과학적 언어로 구체화했다는 점이다. 1부 ‘뇌 이해하기’ 에서는 감정이 뇌에서 어떻게 생성되고, 습관이 어떻게 자동화되며, .. 2025. 8. 20.
[스터디 회고] 쏙쏙 들어오는 함수형 코딩 들어가며 에릭 노먼드의 쏙쏙 들어오는 함수형 코딩으로 책 스터디를 진행했고 각자 분량을 읽고와서 해당 내용에 대해서 의견을 나누는식으로 스터디는 진행 되었다. 이번 스터디를 통해 함수형 프로그래밍이 단순히 새로운 패러다임을 익히는 것이 아니라, 실제 실무에서 즉각적으로 적용할 수 있는 구체적이고 현실적인 기술을 배우는 과정이었다는 것을 느꼈다. 극적인 변화보다는 내가 사용할수있는 개발 도구 상자에 유용한 도구들이 하나씩 추가되는 느낌이었고, 이러한 점이 오히려 실용적이고 지속 가능한 학습 방법이었다. 액션(Action), 계산(Calculation), 데이터(Data) - 코드를 보는 새로운 시각액션(Action) - 부수 효과가 있는 함수들단순한 함수 호출로만 생각했던 것들이 실제로는 명확히 다른 .. 2025. 7. 8.
[리팩터링 2판] JavaScript 리팩터링 도서학습 #8 해당 내용은 위의 책의 내용을 제가 이해한대로 정리해둔 내용입니다. 이번 포스팅에선 Chapter11 의 내용에 대해 다룹니다. Chapter12 상속 다루기12장에서 소개하는 주요 리팩터링 기법들을 요약하고 예제와 함께 정리했습니다. Chapter12 상속 다루기1.메서드 올리기2.필드 올리기3.생성자 본문 올리기4.메서드 내리기5.필드 내리기6.타입 코드를 서브클래스로 바꾸기7.서브 클래스 제거하기8.슈퍼클래스 추출하기9.계층 합치기10.서브클래스를 위임으로 바꾸기11.슈퍼클래스를 위임으로 바꾸기 상속 다루기의 효과상속은 강력한 객체지향 메커니즘이지만, 잘못 사용하면 복잡성을 증가시킵니다.상속 리팩터링의 주요 효과 계층구조 명확화: 클래스 간의 관계와 책임이 명확해집니다코드 중복 제거: 공통 로직을.. 2025. 5. 29.
[리팩터링 2판] JavaScript 리팩터링 도서학습 #7 해당 내용은 위의 책의 내용을 제가 이해한대로 정리해둔 내용입니다.이번 포스팅에선 Chapter11 의 내용에 대해 다룹니다. Chapter11 API 리팩터링 11장에서 소개하는 주요 리팩터링 기법들을 요약하고 예제와 함께 정리했습니다.Chapter11 API 리팩터링1.질의 함수와 변경 함수 분리하기2.함수 매개변수화하기3.플래그 인수 제거하기4.객체 통째로 넘기기5.매개변수를 질의 함수로 바꾸기6.질의 함수를 매개변수로 바꾸기7.세터 제거하기8.생성자를 팩터리 함수로 바꾸기9.함수를 명령으로 바꾸기10.명령을 함수로 바꾸기11.수정된 값 반환하기12.오류 코드를 예외로 바꾸기13.예외를 사전확인으로 바꾸기 API 리팩터링의 효과API(Application Programming Interface)는 .. 2025. 5. 19.
[리팩터링 2판] JavaScript 리팩터링 도서학습 #6 해당 내용은 위의 책의 내용을 제가 이해한대로 정리해둔 내용입니다.이번 포스팅에선 Chapter10 의 내용에 대해 다룹니다. Chapter10 조건부 로직 간소화 10장에서 소개하는 주요 리팩터링 기법들을 요약하고 예제와 함께 정리했습니다.Chapter10 조건부 로직 간소화 1.조건문 분해하기2.중복 조건식 통합하기3.중첩 조건문을 보호 구문으로 바꾸기4.조건부 로직을 다형성으로 바꾸기5.특이 케이스 추가하기6.어서션 추가하기7.제어 플래그를 탈출문으로 바꾸기 조건부 로직 간소화의 효과복잡한 조건부 로직은 코드 이해와 유지보수를 어렵게 합니다조건부 로직을 간소화하면 얻을수있는 이점 가독성 향상: 코드의 의도가 명확해져 이해하기 쉬워집니다유지보수성 개선: 간결한 조건문은 변경 사항 적용이 쉽습니다버.. 2025. 5. 17.
[리팩터링 2판] JavaScript 리팩터링 도서학습 #5 해당 내용은 위의 책의 내용을 제가 이해한대로 정리해둔 내용입니다.이번 포스팅에선 Chapter09의 내용에 대해 다룹니다. 9장에서 소개하는 주요 리팩터링 기법들을 요약하고 예제와 함께 정리했습니다. Chapter09 데이터 조직화 1.변수 쪼개기2.필드 이름 바꾸기3.파생 변수를 질의 함수로 바꾸기4.참조를 값으로 바꾸기5.값을 참조로 바꾸기6.매직 리터럴 바꾸기 데이터 조직화의 효과 명확성 향상: 데이터 구조와 변수 사용이 명확해져 코드 이해도 증가가변성 제어: 변수의 값이 변경되는 지점을 최소화하여 예측 가능성 높임오류 감소: 데이터 의존성과 변경 지점이 명확해져 오류 발생 가능성 감소계산 투명성: 데이터가 어떻게 도출되는지 명확하게 표현하여 유지보수성 향상디버깅 용이성: 데이터 흐름이 명확해.. 2025. 5. 15.