본문 바로가기

전체 글

(65)
일단 10억 모으고 보자. 자산 근황..? 일단 10억 모으고 보자 라는 생각이 갑자기 들었다.요즘 제일 많은 시간을 쓰고 있는 부분이 투자 관련인데 매번 아이디어 혹은 생각이 휘발 되는게 너무 아까워서 정리 해야겠다.지금 투자 포트폴리오 를 정리하고 변화가 생길때마다 업데이트.번외로 검토하다가 탈락한 투자 아이디어도 업데이트.25년 9월 14일 일요일 현재 자산- 전세금 1억- 주택청약 통장 10,050,000- 마통 25,400,000 - isa 31,779,600 - jb금융지주 30,726,600 / +40.2%, 원금 = 약 2200 - 덴티움 1,053,000 / -12.2% 원금 = 약 120 - 개인 연금 - 계좌 1/ kodex 나스닥100, 9,374,740 / +20.2% - 계좌 2/ kodex S&P500 ..
개발자 한 단계 점프 업? 나는 4년차 프론트엔드 프로그래머 인데.. 더 이상 뭘 더 점프업 할지? 애매하다 지금 우매함의 봉우리를 지나 절망의 계곡 즈음에 있는 것 같은데일반적으로 사용되는 웹의 지식들은 너무나 당연하게 느껴지고, 점프업 하려면 3d 그래픽, 미친듯한 성능 최적화, 프론트엔드 플랫폼 엔지니어링 등 좀 더 개념을 확장해야 할 것 같은데 너무나 광범위하게 느껴지고 자료도 너무 없어서 막막하긴 하다. 대부분의 웹 사이트를 만드는데 필요한 개념들은 llm의 발전으로 좀 무의미 한 것 같기도 하고.. 뭘 더 해야할까 싶다webgl 을 해봐야 하나..? 성능 최적화는 어느정도는 쉽지만 극한까지 개선하려면 규모가 큰 회사에 가야 의미가 있을 것 같은데.. 프론트엔드 서버 올려서 api 호출 처리하고 클라에는 최종 필요한 데이..
[바이브 코딩]에 대한 짧은 후기. 회사의 높으신 분들이 AI 에 꽂혀서 바이브 코딩을 찬양 하기 시작 했습니다. 이에 약 1주일간 cursor 의 agent 모드를 적극 활용하여 개발을 진행한 경험을 공유 합니다. 진행한 업무는 사내 어드민 툴에 신규 기능을 추가 하는 것 이었고, 당연하게도 쪽대본 기획서와 함께 개발 했습니다.제가 느낀 점은 다음과 같습니다. 당연하게도, Agent를 잘 활용하기 위해서는 잘 정리된 기획서와 API 명세가 필요하다.나의 경우에는 기획과 API 개발과 웹 개발이 동시에 진행되는 환경이기 때문에... (이하 생략)생각보다 추상적으로 말해도 비슷하게 구현은 해준다. 다만, 검수 및 수정에 더 많을 쓰게 된다.프롬프트만 잘 입력하면 생각보다 뷰도 잘 그려 준다.결과적으로 생산성은 한 5~10% 정도 오른것 같기..
Turborepo를 사용하여 모노레포 구성하기: Storybook 포함 안녕하세요. 이번 글에서는 프론트엔드 개발 환경에 모노레포를 도입하는 방법을 소개 하도록 하겠습니다 모노레포는 하나의 코드베이스에서 여러 애플리케이션과 패키지를 효율적으로 관리할 수 있는 구조입니다. 특히 여러 앱과 패키지를 한 곳에서 관리할 때 Turborepo는 빠른 빌드, 의존성 관리, 최적화된 캐싱을 통해 생산성을 높여줍니다. 이 글에서는 app과 package 폴더로 구성된 모노레포 프로젝트를 단계별로 구성하고, 각 폴더의 역할을 정의하는 과정을 안내합니다.프로젝트 구성도프로젝트는 다음과 같이 구성됩니다. project-root/├── apps/│ ├── app1/│ ├── app2/│ └── storybook/└── packages/ ├── ui/ ├── apiclient..
4년차 비전공자 개발자의 생존기 (1) 어느덧 나도 4년차 개발자가 되었다.정확히는 돈을 받고 일한지는 만 3년이 조금 넘었고, 무급으로 창업팀의 일원으로 개발을 시작했던 경험까지 하면 3년 7개월 정도 되었다.  1. 평범한 대학생에서 창업팀의 서버 개발자로 때는 바야흐로 2020년 산업공학을 전공하던 내가 개발자를 꿈꾸게 되었다. 이유는 당시 주식시장의 엄청난 상승으로 인해서 돈은 주식으로 벌고 일은 재미를 위해서 하자!! 라는 건방진 생각이 뇌를 지배 하였고, 나는 개발자가 되기 위한 여러 방법을 시도하게 되었다. 당시 대학 3학년이고 비전공자 였던 나를 뽑아줄 회사는 전무 하였기에, 대학생 창업팀 혹은 개발 동아리에 들어 가야겠다고 생각을 했었는데 대학생 커뮤니티 에브리타임 앱을 통해서 타 학교 창업팀에 조인 하게 되었다.이 창업팀에서..
리액트 따라만들기 3. 성능 향상 및 fibers 이 글은 이 아티클을 따라 실습을 진행하며 작성한 글입니다. 이 전편의 내용은 링크를 통해 확인 해주세요! 전편에서는 리액트의 렌더 함수를 직접 구현하여 리액트를 사용하지 않고, 컴포넌트를 렌더링 하는 것 까지 구현을 했습니다. 전편에서 만든 yuact는 렌더링 재귀적으로 진행 하고 있는데, 커다란 돔을 한번에 렌더링 하게 될 경우 메인스레드를 너무 오래 차지하기 때문에, 이를 조금 수정해야 합니다. 따라서, 작업을 작은 단위로 나누고 각 작업이 끝난 후, 다른 할 일이 있다면 렌더링을 중단해야 합니다. 브라우저의 requestIdleCallback을 사용하면 브라우저가 유휴 상태 일때 콜백을 실행 할 수 있다. let nextUnitOfWork = null; function workLoop(deadli..
웹 페이지 최적화를 위해 알아야 할 것들을 공부한 것. 참고: https://12bme.tistory.com/140 리액트 따라 만들기를 하다가 동시성의 원리가 궁금해져서 따로 알아본 것들에 대하여 의식의 흐름대로 정리합니다. 맨날 이런거 저런거 찾아보다가 정작 원래 하려고 했던 것들의 진행이 늦어집니다 ㅠ 참고한 블로그의 글은 개발을 시작하고 나서 읽은 기술과 관련된 글 중에 최고네요,, 정말 하나같이 몰랐던 내용들 ( 아무도 알려주지 않았던)이 가득합니다.. 여러번 읽어도 좋을 것 같다. 브라우저의 렌더링 과정 돔 요소와 스타일에 기반을 둔 레이아웃 계산 계산 요소의 화면 표현 (페인팅) 먼저 html 테그들을 파싱해서 돔트리를 구성함 css를 한데 모아 cssom 이라는 트리 구조의 스타일 구조체를 생성함 이 둘을 한데 모아 레이아웃을 계산 => 렌더 ..
리액트 따라만들기 2편. createElement 함수 구현하기 전편: https://kiwitrip.tistory.com/entry/리액트-따라-만들기-1편 github: https://github.com/leeyh-kor/make_react TODO: react의 create element 함수를 구현한다. createTextElement 함수를 구현한다. 두 함수를 오브젝트로 묶어서 사용 가능하게 구현한다. 오직 show만 가능한 render 함수 구현 (업데이트 및 삭제는 나중에 구현) createElement함수 createElement 함수는 element 트리를 반환한다. element 의 자식 요소들이 text(string or number)일 경우 textElement를 반환하고, 아닐 경우 오브젝트를 그대로 반환한다. function createEl..