본문 바로가기

전체 글40

IT는 도구일 뿐 비공식적으로는 어느덧 IT업계에 입문한 지 14년차가 되어간다.공식적으로도 거의 10년은 찍었다는 것을 최근 알게 됨.한 분야의 일을 10여년 이상 해 왔다 보니, 정말 많은 생각을 하게 된다. 꽤 옛날, 그러니까, 대략 몇백 년 정도 전까지만 했어도,피아노나 바이올린을 잘 연주할 수 있으면 부 까지는 잘은 모르겠지만 명성을 떨칠 수 있었을 것이다.왕실에서도 즐기던 오락거리 중의 하나였을테니 나름 부도 얻지 않았을까.수많은 분야들 중 뭔가 하나만 파도 먹힌다는 건 단순해서 좋은 것 같다. 하지만 현재는 그런 삶의 방식이 왠만해선 잘 통하지 않을 것이다.현물 악기의 플레이어들은 충분히 존중받아 마땅하다. 모든게 편리해진 시대에, 능숙히 악기를 연주하는 피아니스트나 기타리스트를 보고 있으면 언제나 큰 감동.. 2026. 1. 10.
프론트엔드 실무에서 구별해야 하는 에러들과 그 의미 1) 404 Bad Request→ 프론트가 잘못된 값 보냄 (JSON 구조/값 오류) 2) 401 Unauthorized → 토큰 없음 → 로그인 필요 3) 403 Forbidden → 로그인은 했으나 권한이 없음 4) 404 Not Found → 주소(엔드포인트) 잘못됨 (가장 흔히들 알고 있는 에러)→ 혹은 요청한 데이터가 존재하지 않음 5) 500 Internal Server Error → 서버 내부 오류로, 프론트 단 이슈 아님 2025. 11. 16.
주니어 프론트엔드가 꼭 이해해야 할 API호출의 흐름에 대해... 📌 주니어 프론트엔드가 꼭 이해해야 하는 API 호출 흐름 5가지1) 어떤 시점에 API를 호출하는지페이지 로딩되자마자?버튼 클릭 시?스크롤 시?모달 열릴 때? 2) 어떤 엔드포인트를 부르는지/users/1인지/login인지/products?category=flowers인지 3) 어떤 방식으로 부르는지 (GET/POST/PUT/PATCH/DELETE) 4) 프론트에서 서버로 어떤 데이터를 보내는지바디(JSON)URL 파라미터쿼리스트링헤더(Authorization 포함) 5) 서버로부터 어떤 응답을 받는지성공 응답 (200, 201 등)실패 응습 (400, 401, 403, 404, 500 등)응답 데이터 구조(JSON 형태) 📌 예시" 로그인 버튼 클릭 "→ POST /auth/login→ body:.. 2025. 11. 16.
퍼블리셔가 막연히 두려워하는 API통신에 대해... 업무 특성상 주변에 많은 퍼블리셔들을 알고 있는데, 그들 중 대부분이 자신이 현재 프론트 개발의 문턱 코앞까지 와 있다는 사실을 잘 모르는 것 같아조금 아쉬운 마음에 글을 적는다. 어느 정도 연차가 쌓인 퍼블리셔라면 HTML환경에서든 Vue나 React 등 프레임웍 환경에서든 UI는 다 그릴 것이다.Script도 별 문제 없이 사용할 것이다.이런 상태에서, "데이터 통신" 만 하면 그게 프론트가 되어버리는 것이다.물론 스스로의 선택으로 퍼블리셔에 머물러 있는 경우도 더러 있는것 같으나, 이왕이면 자신의 업무 풀을 넓히는 것이 스스로에게 훨씬 도움이 되지 않을까 싶다. 업계에서도 "퍼블리셔" 와 "프론트엔드" 는 대우가 좀 다르다. 📌 API통신이란 무엇인가?API는 Application Programm.. 2025. 11. 16.
React + GSAP + Three.js 활용해 살아움직이는 3D Web 만들어보기 실로 오랜만의 포스팅이다.이사 후 새로운 환경에 적응(이라 쓰고 만끽이라 읽음) 하느라...그보다 애초에 주변 지인들에게 제공하고 함께 여러 정보를 공유하며서로 스킬업, 성장할 목적으로 IT 포스팅을 시작하게 된건데, 지인들이 공부를 잘 안함...지금 보고 있는 너! 반성해라 ㅋㅋㅋㅋㅋ 같이 반성하자... ㅠㅠ 하긴. 요즘 세상, 코딩 잘 할 필요 없다. 정확히 말 하면, 큰 틀에서의 개념만 잘 알고 있어도 되는 세상이긴 함.그래도, 직접 해본다는 재미가 있으니까. 그리고 직접 할 줄 알아야 AI와의 협업에서 AI가 뻘짓탭댄스춰도 바로잡아줄수 있는거임.인간은 AI가 있다고 손 놓고 쉴게 아니라, AI와 함께 나아가야 함. 그래야 AI 또한 자신의 창조주를 본받을 지니... 아무튼, 곧 대세는 3D Web.. 2025. 11. 9.
개포동(정확히는 일원동)으로 이사하다 얼마 전, 이사를 완료하였다. 이사 전부터 짐 정리, 쓰레기 버리기, 거대한 소파 처분 등 온갖 미션들이 많아 잠시 블로그를 접었는데이사 후에도 한동안은 바뀐 출퇴근길에 적응하랴 쌓인 짐 정리하랴 + 체력 이슈 + 새로운 프로젝트 적응 이슈등으로 인해 블로그같은 여가 활동은 꿈도 못 꿨다.유일하게 한 여가 활동은 강아지 산책시키기 였다. 항상 차로 5~10분 거리의 초 직주근접 생활을 하다가, 제대로 사람 사는 거주 에어리어로 이동하면서대중교통을 몇년만에 다시 타게 되니 조금은 적응 안된다.그래도, 제대로 된 사람 사는 단지에 산다는 안정감이랄까? 그런건 좋다. 단지 내에 조경이 잘 돼있고 양재천하고도 가깝고, 커뮤니티 시설도 잘 돼있어서앞으로는 여가가 행복한 삶을 살게 될 것으로 기대중. 현재 거실.. 2025. 9. 19.
人間ひどすぎ案件 最近ほんと人に振り回されすぎて、もう誰かが近づいてくるのも、自分から行くのも全部めんどくさい。 「別に仲良くする必要ある?」「わざわざ笑顔でスモールトークする意味ある?」ってしか思えない。 元々は内向型だけど、周りからは外向型っぽく見られる。でもそれ、社会っていう仮面舞踏会で演じてただけ。男だから、30代だから、肩書きあるから、勝手に期待される役割があって、それ外すと場が冷めるし仕事が回らなくなる。 だからこっちから話しかけて、空気作って、人を引っ張って…それを何年もやってきたら、気づいたら「友達」じゃなくて「大衆」ばっか相手してた。正直、孤独。でも自分がやらなきゃ場が回らないから無理してやってたら、MBTIはIなのにEって思われてた。 でももう限界。人間関係で火傷しすぎて、今はただ静かに一人で仕事してたい。深く関われば関わるほど失望増えるし、傷つけ合うし、寝れなくなって病院行く羽目に.. 2025. 8. 15.
사람 이슈 하도 사람들에게 이리 치이고 저리 치이다 보니 이젠 누군가에게 다가가는게 힘들다. 아니, 힘들다기보단 귀찮아진것 같다. 예를들면, 왜 굳이 잘 지내야 하나. 왜 굳이 웃으며 대화를 해야 하나. 왜 스몰 토크를 해야만 하나 등등. 누군가에게 먼저 다가가는것도 힘들고 거북한것 같다. 난 원래 내향적인 사람이다. 다들 아니라고 생각하지만. 예를 들어, 당신의 눈 앞에 공이 하나 놓여있다 치자. 그리고 그걸 누군가에게 던진다. 그 공을 받는 누군가가 '소녀'일 경우, 당신은 무의식중에 너무나도 당연하게, 그 소녀가 공을 무사히 피하길 바랄 것이다. 하지만 그 공을 받는 누군가가 '소년'일 경우, 당신은 아주 당연하게, 그 소년이 공을 멋지게 받아 드리블하길 기대할 것이다. 이렇듯, 사회란 일종의 가면 무도회 같.. 2025. 8. 15.
이사 이슈 9월에 이사가게 돼서 준비중인데 살다 살다 내 생에 가장 힘든 이사 준비를 해봄 심지어 이사 날짜도 확정인건지, 확정이 아닌건지 뭐라 뚜렷히 얘기하기가 힘듬 어느쪽도 확정이 되지 않은 상황에서, 막연하게 '아마 확정 되겠지' 라고 가정 하고 이사일정만 잡은 느낌도 들고 이사도 그냥 무지성으로 포장이사해버리고 난 그냥 탭댄스추고있으면 되는 그런게 아니라 버릴 가구도 있는데 심지어 그게 대형 가구들이다 지금 사는곳 엘베에 안들어가서 계단으로 내려야 함 이 와중에 와이프 사업관련 이슈 생기고 해서 너무 바쁘고 정신없고 질식할것만 같은 시즌을 보내고 있는데... 그래도 어떻게 어떻게 큰 산을 두어개 정도 넘고, 마지막 언덕 하나 남은 느낌이긴 하다. 이 또한 추억이 되겠지... 2025. 8. 15.
React.js 쇼핑몰 만들기 | #1. 프로젝트 세팅, Styled Component 활용해보기 한동안 Vue.js나 Nuxt.js만 써 오다가, 최근 들어 리액트 프로젝트에 투입되면서다시금 초심으로 돌아가 React.js를 공부해보자 라는 생각이 들었다. (첫 프론트엔드 입문을 React.js로 했었음.)그래서, 몇 년 전에 해본거긴 한데 기억을 더듬어가며 개인연습 겸 겸사겸사 포트폴리오 겸 쇼핑몰 만들기를 해보려고 함.이왕 하는김에 지금 진행중인 프로젝트와 비슷한 레이아웃 구성으로 가보려고 한다. (창의성이 오래전에 고갈되었는지... 독창적인게 생각 안난다 ㅠ) 🛠️ 사용 기술 스택 정리 💻 프론트엔드 - React : 컴포넌트 기반 UI 개발- Vite : 빠른 빌드 및 핫 리로딩을 제공- TypeScript : 정적 타입 기반 개발로 안정성 향상 🎨 스타일링- Emotion (@em.. 2025. 7. 27.
C언어 입문자용 | #1. 개발환경 세팅하기 C언어는 코딩 → 컴파일 → 실행의 과정을 거쳐야 함.컴퓨터가 C언어를 이해할 수 없기 때문에, 컴파일러가 C코드를 기계어로 번역해줘야 함. [작성한 C코드] -- (컴파일러) --> [기계어(실행파일)] 중간 통역 역할을 해준다고 보면됨.컴파일러(gcc)가 없으면 컴퓨터는 절대 C코드를 이해할 수 없음. 그래서 C언어는 반드시 컴파일이라는 과정을 거쳐야 함... 따라서,(1) 코드를 작성할 편집기(2) 코드를 번역할 컴파일러 이 두 가지가 필요함. 📌 개발 환경 세팅방법 1 : Visual Studio Code (VSCode) + gcc가볍고 깔끔한 개발환경을 원한다면 이 세팅방법으로 가는게 나쁘지 않음. VSCode 매우좋음.🔹 1단계: VSCode 설치https://code.visualst.. 2025. 7. 19.
C언어 입문자용 | #0. C언어란 무엇인가? 📌 C언어란 무엇인가?- 프로그래밍의 기초이자, 모든 언어의 뿌리. ✅ C언어의 탄생1972년, 벨 연구소의 **데니스 리치(Dennis Ritchie)**가 개발운영체제인 **유닉스(UNIX)**를 만들기 위해 탄생이후로 시스템 프로그래밍의 표준처럼 자리잡음 ✅ 왜 지금도 C언어를 배우는가?컴퓨터의 작동 원리를 가장 잘 이해할 수 있는 언어빠르고 가벼운 성능: 하드웨어에 가까운 저수준 언어포인터, 메모리 제어: 다른 언어에서는 잘 보지 못하는 개념운영체제, 임베디드 시스템, 디바이스 드라이버 제작**다른 언어(C++, Java, Python 등)**가 C언어의 영향을 많이 받음 ✅ C언어의 특징빠른 속도: CPU와 가까운 언어직접적인 메모리 접근: 포인터간결한 문법, 하지만 실수하면 오류도 치명적이.. 2025. 7. 19.
React Hook의 이해 | useState, useEffect ✅ useState: 일종의 "메모장" 같은 것.컴포넌트 안에서 특정 값을 기억하고 싶을 때 사용하는 용도.ex1) 버튼을 몇 번 눌렀는지 숫자 기억하기. (count와 setCount 예제는 아마 지겹게 자주 보셨을것임.)ex2) 입력창에 입력한 값 기억하기.const [count, setCount] = useState(0); count: 현재 기억하고 있는 숫자setCount: 그 숫자를 바꿔주는 펜버튼 클릭할 때마다 숫자 써놓은 값을 바꿀 수 있음.바뀌면 화면도 자동으로 다시 그려짐(리렌더링). ✅ useEffect: "알람시계" 같은 개념.어떤 일이 일어났을 때(조건) 자동으로 실행되는 코드.ex1) 컴포넌트가 처음 화면에 나타났을 때 실행ex2) 특정 값이 바뀔 때마다 실행ex3) API 호출.. 2025. 7. 18.
Typescript | 타입스크립트에서 지정할 수 있는 기본적인 타입 종류들 타입설명예시number숫자0, 1, -3, 3.14string문자열"hello", 'a'booleantrue / false 값true, falsenullnull 값nullundefined정의되지 않음undefinedobject객체{ name: 'hello' }array배열number[] , string[]tuple고정된 길이의 배열[number, string]any아무 값이나 가능any 값unknown정체 불명의 값unknownunion여러 타입들 중 하나number | stringcustom type직접 정의한 타입type User = { id: number, name: string } ※ 사용 예시const [count, setCount] = useState(0);const [text, setTex.. 2025. 7. 18.
호텔 추천 | 페어필드 바이 메리어트 부산 송도비치 조식맛집 6월초 부산 송도 다녀옴근데 황당하게도 방 사진을 안찍었다는걸 방금 깨달음창밖 뷰 사진만 엄청 찍음... https://www.marriott.com/ko/hotels/pusfb-fairfield-busan-songdo-beach/overview/ Fairfield by Marriott Busan Songdo Beach | Marriott BonvoyFairfield by Marriott Busan Songdo Beach에서 숙박을 예약하세요. Busan 근처의 편리한 비즈니스 호텔에서 무료 Wi-Fi, 편안한 객실 등을 살펴보세요.www.marriott.com 객실정보는 여기서...우리 부부는 King Guest Room에 묵었음 1층에 편의점이 있어 매우 편리함루프탑도 가봤는데 텐트나 의자같은게 비.. 2025. 7. 15.
TOP

Designed by AndersonLab