반응형 Create / Update 시 응답에 변경된 리소스를 포함해야 할까? 최근 회사에서 리액트를 사용해 어드민 서비스를 개발하면서, POST 요청의 처리 방식에 대해 생각하게 되었다. '왜 POST 요청 후에 변경된 데이터가 응답으로 오지 않을까?' 라는 의문이 든 것이다. 현재의 방식에서, 서버는 HTTP 상태 코드와 간단한 결과 메시지만을 응답한다. 예를 들어, "처리되었습니다."와 같은 메시지다. 그런데 만약 API 응답에 변경된 리소스가 포함되어 온다면 그 데이터를 즉시 사용할 수 있어서, 클라이언트는 추가적인 GET 요청을 보낼 필요가 없어진다. 또한, 별도의 데이터 리패치(refetch) 함수를 만들 필요도 없다. 그래서 좀 더 효율적이고, 깔끔하게 구현할 수 있을거라 생각했다. 다른 개발자들의 생각은 어떨까? 그래서 궁금했다. 다른 개발자들은 어떻게 구현하고 있을.. 2023. 12. 17. 회사 웹 서비스 개선기: URL 인코딩 최근 문제를 재미있게 해결한 경험이 있다. 그렇게 큰 문제는 아니었지만, 나름 뿌듯했던 순간들이 있어서 글을 쓰게 되었다. 이번 글에서는 해당 문제의 해결 과정과 URL 인코딩에 대한 간략한 설명을 다룬다. 해시(#) 이후 문자들이 잘려요 회사에서는 이미지 파일들을 업로드 하고 관리하기 위한 회사 전용 웹 서비스가 있다. 예를 들어, 행사나 새로운 서비스를 홍보하는 이미지를 업로드하면 회사 홈페이지나 어드민 페이지의 공지사항 모달창에 표시된다. 업로드를 할 때는 이미지의 노출 기간과 링크를 입력할 수 있다. 문제는 이미지 링크에 해시(#) 문자를 포함하면 '#'부터 이후 문자들까지 전부 잘려서 업로드가 된다는 것이었다. 이미지를 클릭하면 링크 페이지로 이동 후, 해당 위치로 스크롤이 되지 않는 것이다. .. 2023. 8. 15. URI의 스킴(scheme)과 프로토콜(protocol) 어젯밤, 개발 톡방에서 관심이 가는 내용으로 질문이 올라왔다. 흥미로운 주제라서 나도 한 자리 차지하기 위해 공부해서 정리한 후 내용을 공유했다. 질문의 내용은 URI의 스킴이 프로토콜을 포함하는 용어인지에 대한 질문이었다. 먼저, URI(Uniform Resource Identifier)는 프로토콜을 사용하여 인터넷상의 리소스를 고유하게 식별하고, 위치를 지정하기 위한 문자열이다. 이때, 프로토콜의 이름을 '스킴'으로 나타낸다. 예를 들어, 'https://example.com'에서 'https'는 스킴으로, 해당 URI에서 사용하는 프로토콜인 'Hypertext Transfer Protocol Secure'를 나타낸다. 따라서 스킴은 URI 주소의 시작 부분에 위치하며, 콜론(:) 앞의 문자열로 표시.. 2023. 4. 25. URI, URL 그리고 URN 이해하기 웹 프론트엔드 개발자로 일하면서 경험하는 혼란스러운 단어들이 있습니다. URI, URL 그리고 URN에 대한 명확한 개념이 저에게 필요했습니다. 가끔씩 이 용어들을 볼 때마다 '무슨 차이지?', '이런 경우엔 URI라고 해야하나?' 등의 혼란을 겪습니다. 이제 더 이상 혼란을 겪지 않기 위해 정리를 해보는 시간을 가져보려 합니다. 시작하기 먼저 이 개념들의 목적은 명확합니다. 바로 인터넷상의 리소스를 식별하기 위한 수단이라는 점입니다. URI(Uniform Resource Identifier) URL(Uniform Resource Locator) URN(Uniform Resource Name) 결국 모두 리소스의 식별자 역할을 하는 것에는 동일합니다. 하지만 마지막 단어에서 이들의 역할을 어느 정도 생각.. 2022. 12. 25. IE로 접속 시 알림창(alert) 띄우기 IE에 대해 좋은 감정을 가진 개발자가 몇이나 될까? 나도 조금이나마 직접 경험을 해보니 왜 IE 사라져라 IE를 골칫덩이로 생각하는지 알게되었다. 다행히 나는 IE가 사라지고 있는 시대에 살고 있다. 선배 개발자분들 덕분에 많은 부분이 추상화 되어 있어(바벨) 고생을 덜 했지만 라이브러리 사용에 제약이 있기도 했고, CSS 최신 구문을 사용하다가(e.g. , min(), padding-inline, clip-path 등) IE가 지원을 안해서 예전 구문으로 전부 바꾼 적도 있었다. 그런데 이제 MS가 공식적으로 2022년 6월 15일부터 IE11 지원을 종료함에 따라, 회사에서도 이걸 인지하여 알림창을 통해 다른 브라우저를 사용하는 것으로 권장하기로 했다. IE로 접속 했는지 확인하기 - User Ag.. 2022. 4. 29. 배포 자동화? CI/CD가 무엇일까? 회사에서 프론트엔드 개발 환경에 대해 고민하고 구축해볼 기회가 생겼다. 그러던 중에 팀원들 전체에 도움이 될 수 있는 배포 자동화, CI/CD에 대해 공부하게 되었다. 해당 개념에 대해 알아보고 이해하는 시간을 가져보자. 어쩌다 배포 자동화, CI/CD가 생기게 된 것일까? 반복되고 지루한 절차들은 자동화를 하고 싶다. 보통 배포하는 과정은 고정적이고 변경된 코드를 적용하기 위한 잦은 배포는 생각보다 시간을 많이 소비할 수 있다. 즉 개발자의 리소스가 비효율적으로 활용되기 때문에 배포 자동화 시스템이 필요하다. 배포 자동화 시스템에서의 CI/CD CI(Continuous Integration, 지속적 통합) CI/CD의 'CI'는 개발자를 위한 자동화 프로세스인 지속적 통합(Continuous Integ.. 2021. 12. 9. Image Lazy Loading 기법으로 웹 성능 최적화하기 초기 로딩 시간을 단축해주는 Image Lazy Loading 기법 현재 화면에 보여지지 않는 이미지들은 lazy loading 처리를 통해 웹 페이지 초기의 로딩 시간을 단축하여 웹 성능을 향상 시킬 수 있다. image lazy loading 기법은 무엇인지, 그리고 해당 기법을 IntersectionObserver API를 사용한 예시를 보면서 알아보자. Image Lazy Loading이란? 페이지 안에 있는 실제 이미지들이 실제로 화면에 보여질 필요가 있을 때 로딩을 하게 만드는 기법 웹 페이지 내에서 바로 로딩을 하지 않고 로딩 시점을 뒤로 미룬다 영어 단어 중 'lazy'는 '가능한 길게 일을 미루는 행위'란 의미에 기반한다. lazy loading을 다루는 방식은 페이지 내의 거의 모든 리.. 2021. 10. 30. 이전 1 2 3 4 다음 반응형
