본문 바로가기

Programming/Sabujak Sabujak3

AWS Lambda@edge 사용해서 ".html" 지워버리기 (feat. NextJS) NextJS를 사용해서 배포하면, 뒤에 www.test-url.com/home.html (가칭) 이런 형태로 뒤에 html이 붙는 걸 확인할 수 있다. 그냥 React.js를 활용할 때와는 달리, NextJS는 SSR을 활용하기 때문에, 이런 현상이 있는 것 같다. 이런 형태의 URL은 도저히 용납할 수 없는(?) 형태였기 때문에, 최우선순위를 두고 찾아봤다. 어떻게 검색해야 할 지도 약간 가늠이 안가서, 초반엔 좀 고생을 했다. dynamic routes 하면 /post/[id] 형태로 나오는 친구들을 라우팅해주는 이야기만 나오고.. 흑흑.. 하지만 해결했다. 기분니가 좋다. 후후 해결한 방법에 대해 간략하게 정리해보겠다. 아래 해결방법은 Next.js + S3 + Cloudfront로 이미 프로젝트가.. 2022. 4. 30.
사이드 프로젝트 톺아보기[1] - 나만의 만다라트 만들기 들어가기 오랜만에 예전에 했던 사이드 프로젝트들을 살펴보기로 했다. 리액트로 만든 나의 첫 사이드 프로젝트! 만다라트부터 이야기를 해보려고 한다. tmi가 정말 많을 예정이다. 그냥 tmi 그자체 . 케케케 대학시절 친구의 추천으로 알게 된 만다라트 기법! 하나의 큰 목표를 가지고 그를 실행하기 위한 목표를 9x9 Table에 차근차근 세워나가는 기법이다. 일본의 야구선수 오타니 쇼헤이가 작성했다고 해 한 때 인기를 끌었다고 한다. 나도 한 때 열심히 만들긴 했었지 ^^;;; 당시에 반짝 재밌게 목표를 세웠었지만 세월이 지남에 따라 기억 속에서 잊혀져 있었는데, 우아한 테크코스를 하면서 한 코치분께서 만다라트를 소개해주시면서 다시 생각이 났다. 추억,,,,, (포코 감사해요 푸힝) 웹 개발자라는 새로운 .. 2021. 9. 18.
Input을 구현하는 다양한 방법(Input, Textarea, ContentEditable) (프로젝트 앞광고) https://mandalart.ddongule.com/ 이번에 만다라트라는 작은 프로젝트를 사브작 사브작 만들면서 사용자 입력을 받는 Input에 대한 고민을 하게 되었다. 내가 원래 만들고자 한 내용은 아래와 같은 모양이었다. 1. 정사각형 모양 (contentEditable, Textarea, Input) 2. 글씨가 vertically, horizontally centered (contentEditable, Input) / Textarea도 가능하긴 한 것 같은데 아직 답을 찾지 못했다ㅠ 3. multi line이 가능 (contentEditable, Textarea) 처음에는 단순히 Input으로 구현했지만, 내가 원하는 multi line을 만드려면 textarea로 바꾸어.. 2021. 5. 10.