이전부터 FSD에 대해 관심이 있었고, 사용해보고 싶은 마음은 항상 있었는데, 이번에 React Native(이후 RN) 으로 프로젝트를 시작하게 되면서 이 아키텍처를 적용해보게 되었다. 적용해보게 되면서 생각했던 생각들을 정리해보려고 합니다. 기본적인 FSD가 궁금하다면 해당 공식문서에서 확인해보면 좋을 것 같다. https://feature-sliced.design/kr/docs/get-started/overview Overview | Feature-Sliced DesignFeature-Sliced Design (FSD) 는 프론트엔드 애플리케이션의 코드를 구조화하기 위한 아키텍처 방법론입니다.feature-sliced.design 이 지식을 가지고 RN을 적용해 보려고 했는데 고려할 점이 생겼다...

회사에서 홈페이지를 만들어 달라는 부탁에 홈페이지 템플릿을 통해 만들어진 틀에 개발을 하게 되었다. 그렇다보니 이전에 써본적 없는 기술들을 접하게 되었는데 그중에 tailwind을 처음 접하게 되면서 트리블 슈팅이 생겼는데, 하루 넘게 걸려서 해결되어, 이 짜릿한 순간에 글을 남기려고 한다. (AI 때문에 오히려 더 헤멤 ㅡㅡ) 문제 {t.rich("title", richTextHandlers)} 일단 display -> 글꼴, 크기, 행간 등 text 스타일 blue-dark는 말 그대로 색을 정해주는 스타일이다. 근데 이렇게 쓰게되면 ....이렇게 맨 나중에 선언된 것만 적용이 되고 이전 것은 적용되지 않는 문제가 발생한다. 처음에는 당연히 제미나이, claude를 통해 해결을 해보려..

REST API에 대해서 공부하면서 HTTP Method에 대해서 정리할 필요성을 느껴 정리하게 되었습니다. HTTP Method ?클라이언트와 서버 사이에 이루어지는 요청과 응답에 대해 데이터를 전송하는 방식을 말하며, 서버가 수행해야할 동작을 지정하는 요청을 보내는 방법 HTTP Method의 종류GET : 데이터 조회POST : 데이터 생성PUT : 데이터 수정PATCH : 데이터 일부 수정DELETE : 데이터 삭제이것 말고도 4개(OPTIONS, CONNECT,HEAD, TRACE)가 있기는 하지만 주로 쓰는 것 위주로 글을 작성하겠습니다. HTTP Method - GETGET 메소드는 서버에 저장된 데이터를 조회할 때 사용하는 메소드입니다.요청할 때 별도의 Body를 포함하지 않으며, 필요한 ..

프로젝트를 시작하게 되면서 발생하는 이슈를 정리해보고자 이렇게 글을 쓰게 되었습니다. 앞으로 작은 것이든 큰 것이든 정리해 나가려고 합니다. 상황 설명질문에 대해서 답변을 제출할때 enter를 통해서도 가능하게 하면 좋을 것 같아 input 에 onKeyDown 에 handleKeyDown 을 호출시켜 handleSubmit을 할 수 있도록 하려했습니다.const handleSubmit = () => { submitDailyAnswer({ assignedQuestionId, answer: inputValue });}; const handleKeyDown = (e: React.KeyboardEvent) => { if (e.key === 'Enter' && !e.shiftKey) { e..

전에 REST API를 알기 위해서 REST에 대해서 공부를 해보았습니다.이제 여기에 + API 인 REST API란 무엇일까에 대해서 알아보겠습니다. API ?먼저 REST를 알아보았으니 API도 뭔지 알아봐야겠죠?API(Application Programming Interface) : 프로그램끼리 서로 기능이나 데이터를 주고 받을 수 있도록 정해놓은 규칙 이렇게 api는 정보 교환을 원활하게 하기 위해서 만든 규칙이라고 생각하면 될 것 같습니다. REST API ?이를 통해 알 수 있는 REST API는 REST의 규칙을 따르면서 만든 API라고 보시면 될 것 같습니다.이를 위해서 디자인 가이드가 있는데요. 이를 소개하겠습니다. REST API 디자인 가이드1. 자원은 명사로 표시하기 (동사 x)G..

REST의 정의"REpresentational State Transfer" 의 약자로 해석해보면자원의 표현( representational )으로 구분하여 자원의 상태를 전송하는 것 즉, HTTP URI를 통해 자원을 명시하고, HTTP Method(CRUD : GET, POST, PUT, DELETE)를 통해 자원을 처리하는 아키텍처를 의미합니다. REST의 특징REST 의 특징에 대해 살펴보면 REST의 의미를 더 잘 이해할 수 있습니다. 1. Server-Client클라이언트와 서버를 명확히 분리하여 서로 독립적으로 발전할 수 있도록 한다.이에 대한 예시를 들면 www.example.com/users/1 을 요청을 한다 했을때1. client 는 이를 1번 사용자에 대한 정보 요청2. server..

웹 공부를 하다고면 항상 나오는 말 중에 하나가 SPA, MPA 인데 대충은 무슨 말인지는 알지만 정확하게 두 개념에 대해 이해해보려정리를 해보려고 합니다. 1. MPA ?SPA에 대해서 이해를 하기 위해서는 MPA부터 이해를 할 필요가 있습니다.MPA(Multi Page Application) : 여러 개의 페이지로 구성된 Application위 사진을 보면1. Client가 서버를 호출2. Server에서 HTML 페이지를 처리하여 전달3. Client에서 다시 form POST 과 같은 요청을 받으면4. server에서 해당 데이터를 받아 새로운 HTML을 전달이러한 Lifecycle을 볼수가 있는데, 이를 통해서 알 수 있는 특징(장단점)들을 써보겠습니다. MPA 장점SEO에 유리하다 서버에서 페..

객체지향에 대해서 공부하다보니 이를 설계하는 원칙이 SOLID가 있다고 합니다. 들어보니까 이를 정확하게 지키면서 개발하는 개발자는 극히 드물지만 그래도 알고 있다면 개발할 때 도움이 되는 지식이니 정리하려고합니다.3 - 1. S (Single Responsibility Principle)   - 단일책임 원칙클래스는 오직 하나의 책임만 가져야 하며, 하나의 변경 이유만 가져야 한다.즉, 하나의 클래스는 하나의 역할만 수행하도록 설계해야 합니다.여러 기능을 한 클래스에 모두 넣으면, 어떤 기능 하나가 바뀔 때 전체 코드가 함께 변경될 수 있어 유지보수에 불리해집니다.3 - 2. O (Open/Closed Principle) - 개방/폐쇄 원칙소프트웨어 요소는 확장에는 열려 있어야 하고, 수정에는 닫혀 있..