내가 생각하는 프로젝트 규모에 따른 프론트 기술스택 선정기준
·
개발
웹 에이전시를 다니다 보니 클라이언트의 요구사항과 재정에 따라 프로젝트의 기술스택을 정하는 것이 효율적인 개발에 있어 중요하다고 생각하게 되었다. 회사를 운영하는 관점에서는 더욱 중요하겠지만, 개인적인 프로젝트를 할 때에도 빠른 배포가 목적이라면 기획자의 요구사항에 가장 적합한 기술스택을 선정해 진행하는 것이 옳다고 생각한다. 이전에는 Nuxt.js를 쓰면 CSR, SSR, SEO 다 대응 가능하니까 무조건적으로 좋은 기술을 쓰는게 좋지 않은가? 라고 생각했었다. 하지만 다양한 기술을 지원한다는 것은 그것들을 핸들링 하기 위한 배경지식이 마련되어 있어야 한다는 것을 느꼈다. 배경지식 없이 일단 진행하기엔 차후 에러를 일으킬 가능성과 삽질을 하게될 가능성이 높아지기 때문이다. 이러한 부분은 개발 속도와 단..
[Webflow] Scroll into view 애니메이션이 한 번 밖에 실행이 안될때
·
개발
Webflow를 통해 애니메이션을 제작중 Scroll into view 트리거가 생각대로 동작하지 않는 경우가 있었다.구글링을 통해서도 잘 나오지 않는 에러여서 공유하면 좋을 것 같아 글을 써본다. 내가 제작해야 할 애니메이션 효과는 아래와 같았다.이벤트 트리거가 전부 보여지면 애니메이션을 실행시킴페이지를 넘기면 특정 애니메이션의 그림이 그려짐이전 페이지로 돌아갈 경우 그려진 애니메이션이 사라짐 처음엔 단순히 Scroll into view를 이용해서 유저의 뷰포트 내에 페이지가 들어오면 애니메이션을 실행시키면 되겠다고 생각했다. Webflow의 Scroll into view 애니메이션에는 두 개의 트리거가 있다.When scrolled into view: 뷰에 해당 요소가 진입했을때 실행시킴.When s..
[AWS EC2] 프론트를 배포해 둔 인스턴스의 용량이 가득 찬다면
·
개발
최근에 나에게 일어난 트러블인데 이와 관련된 글이 잘 보이지 않아 비슷한 고민을 하고 있는 사람들을 위해 글을 남겨두려고 한다. 이 글을 찾은 사람들 중 다음과 같은 상황이라면 도움이 될 수도 있을 것 같다.usage of memory가 가득찼다!배포만 하고 가만히 두었는데 메모리 용량이 가득찼다!No space left on device 에러가 발생한다!진짜 프로젝트를 하면서 정말 시간을 많이 잡아 먹었던 부분이어서 꼭 글로 남겨야겠다고 생각했다. (잘못된 글일수도 있으니 참고만 해주시고 지적이나 조언 해주시면 감사하겠습니다!)최근들어 이전의 개발한 서비스들의 유지보수를 하고 다시 빌드를 하려고 할 때, "no space left on devide" 라는 에러가 뜨면서 빌드가 되지 않았다. 해당 프로젝..
Reactivity와 Proxy 간단히 알아보기
·
개발/Javascript
React, Vue 같은 라이브러리나 프레임워크들을 쓰는 목적은 여러가지가 있겠지만 하나의 페이지에서 데이터를 동적으로 변경하기 위함(SPA)도 있을 것 이다. Vue에 대해 공부하던 중 Vue는 일반 객체를 제외한 반응형 객체들은 변경사항을 추적하기 위해 Proxy 객체로 변환한다는 사실을 알게 되었고 관련된 개념이 모자라 간단히 정리해보려고 한다.반응성 (Reactivity)Vue 공식 문서에선 반응성(Reactivity)에 대해, "변경"에 대한 제어를 선언적으로 수행하는 프로그래밍 패러다임이라고 나와 있다. 간단히 말해 내부에서 변경을 어떤식으로 이루어지게 하는지보다 해당 방식을 통해 변경을 이뤄지게 하겠다에 대해 중점이 맞춰진 방식이란 말이다. (여기서 선언형 프로그래밍이 이해가 되지 않는다면..
Vue 프로젝트 투입 하루 전 읽어볼 글
·
개발
필자는 여태까지 계속 React만 써오다가 인턴을 하게 되면서 처음으로 Vue와 Nuxt를 접하게 되었다. 기존 회사의 서비스가 Vue2 + Nuxt2로 작성되어 있어서 Vue3 + Nuxt3로 마이그레이션을 하는 일을 받게 되었는데, Vue에 대한 개념도 없어서 삽질을 많이 했다.그래서 나처럼 모종의 이유로 React에서 Vue3나 Nuxt3를 처음 사용하게 될 사람들을 위해 도움이 될법한 글을 써보려고 한다. 공식문서 읽어보기우선 Vue와 Nuxt를 다루게 된다면, 모르는 것이 생길때 마다 구글링해서 블로그를 찾아보는 것 보단 공식문서 내에서 찾아보고 정독해보는 것을 추천한다.왜냐하면 대부분이 Nuxt2와 같이 이전의 문법으로 적힌 문서들이 많았고 Vue는 Options API와 Composition..
2023: 제너럴리스트 & 인맥
·
회고 & 생각/연간회고
서론이번 회고의 제목은 올해 내가 가장 고민을 많이 한 단어들로 골라보았다.왜 벌써 2024년인지 모를 만큼 올해는 정말 많은 일들이 있었다. 올해는 방황을 많이 했다.몇 년동안 해오던 고민이고 지금은 조금 정리가 되었지만 그래도 마음 한편엔 남아있는 생각."나는 개발은 좋아하는데.. 어떤 개발을 하면 좋을까?" 이다.2020년부터 2023년까지 너무 긴 고민을 하고 있다.생각이 많아질 때마다 다시금 눈앞에 있는 일부터 제대로 하자라는 생각을 했고 정체는 하지 않았다고 생각한다.그렇게 기회를 잡으니 뛰어난 사람, 시니어, 주니어, CEO, 직장인 등등 여러 사람들과 만날 기회가 생겼고 인맥을 만들기 위해 노력했다.그러다 보니 고민을 조금씩 해결해 주시는 분도 계셨고 기회를 주시는 분도 계셨다.기회가 주어..
성장! 그거 어떻게 하는 건가요? - 김준비
·
강연
자기 객관화 메타인지를 통해 어떻게 하면 성장을 효율적으로 할 수 있을까 리스크를 줄이는 방법으로 상대방과 나를 아는 것이 매우 중요하다 라고 한다. 비대면 상황속에서 내가 어떻게 하면 빨리 성장하고 인정 받을 수 있을까를 고민해봄. 고민을 굉장히 많이 하셨다고 함. 추상적인 생각으로 부터 정의를 내리고 싶었다고 함. 좋은 개발자는 어떤 개발자일까? 나는 어느쪽에 속하는지 뭘 추구하는지 생각해보기 Q1. 일 잘하는 개발자 (✔️) 개발 잘하는 개발자 Q2. 빠르게 개발을 잘하는 개발자 (✔️) 안정적인 개발을 잘 하는 개발자 Q3. 다양한 분야의 개발 지식을 갖고 있는 개발자 한 분야에 깊은 지식을 갖고 있는 개발자 (✔️) Q4. 커뮤니케이션은 잘 하는데, 개발은 평범하게 하는 개발자 (✔️) 개발은 ..
간단한 프로젝트에서 쓰기 좋은 Git Branch (Git Workflow) 전략
·
개발
어디까지나 학부생 글쓴이의 관점에서 생각된 내용입니다. 반박과 질문 환영입니다. 목차 이번 학기 "소프트웨어개발실무"라는 과목을 수강하면서 개발에 대한 Best Practice를 고민해 보게 되었다. 이 수업을 들으면서 조사한 내용 중 실제로 당장 프로젝트에 적용해 볼 만한 내용들이 있었고, 이 내용들을 정리해 하나의 케이스로써 팀원들에게 "이런 방식으로 해보면 어떨까요~??"라고 말해보는 것도 좋을 것 같아 작성을 해보게 되었다.Base주로 Git Workflow 방식에 대해 찾아보면 Git Flow, Github Flow, Gitlab Flow 3가지 방식이 나온다. 꼭 branch 전략을 이런 case로 가져갈 필요는 없지만, 나름의 고민을 해보면서 아래와 같은 점들은 꼭 지켜져야 될 것 같다고 생..