클린코드 - 01. 깨끗한 코드 원초적 난제 기한에 맞추려면 나쁜코드를 양산할 수 밖에 없다고 느낄 것이다. 하지만 코드를 최대한 깨끗하게 유지하는 습관이 기한 맞추는 유일한 방법일지 모른다. 깨끗한 코드라는 예술? "깨끗한 코드가 무엇일까?" "어떻게 작성할까?" '깨끗한 코드'가 무엇인지 조차 모른다면 노력해봤자 소용없다. 하지만 이 말이 '깨끗한 코드'와 '나쁜 코드'를 구분할 줄 알아야만 '깨끗한 코드'를 작성할 수 있다는 의미는 아니다. ‘코드 감각’이 있다면 개선할 방안이 떠오를 것이다. 다만 '코드 감각'은 누군가는 타고날수도 있고 누군가는 경험을 통해 얻을 수도 있다. 깨끗한 코드란? 비야네 스트롭스트룹 "우아하고 효율적인 코드를 좋아한다." 우아하고 효율적인 코드를 좋아한다. 효율적인 코..
서론 프로젝트에서 openAPI를 호출해서 사용하는 부분이 있었는데, 아니나 다를까 교차 출처 리소스 공유(CORS, Cross-origin resource sharing) 에러가 발생하였습니다. (당연한거슬..) 자 그래서 이 문제를 천천히 해결해보았는데요.. 일단 CORS 에러가 발생하는 이유는 브라우저는 서로 다른 도메인에 대한 요청을 보안상 제한하기 때문입니다. 즉, 내 사이트 (http://okayoon.com)에서 openAPI (https://api.ipify.org)로 요청을 하게 되는 경우 다른 도메인이기 때문에 CORS 에러가 발생합니다. 그 다음 왜???? 제한하는지 간단히 이해하고 넘어가겠습니다. JSON은 단순 데이터만이 아닌 Javascript 자체도 전달할 수 있는데, 이럴 경..
URI? URL? 같은거 아니었어? 엥 URN은 또 뭐야?
많은 사람들이 URI, URL은 혼용해서 사용하는 경우가 종종 있습니다. 뭐, 문제 없이 소통이 되기 때문이죠.. 하지만 이 둘의 정확한 차이를 알고 넘어가지 않는다면, 우리에게 발전이 없으므로^^ 오늘 URI와 URL의 차이를 짚고 넘어가보도록 하겠습니다. 플러스로 URN에 대해서도 알아봅시다. URI (Uniform Resource Identifier) - 식별자 웹 기술에서 사용하는 논리적 또는 물리적 자원을 식별하는 고유한 문자열 시퀀스입니다. 자원을 나타내는 유일한 주소이며 인터넷 프로토콜이 항상 붙어다닙니다. 이미지를 보면 URI가 가장 상위개념인 것을 알 수 있습니다. URL (Uniform Resource Locator) - 위치 웹 주소라고하며 네트워크 상에서 자원이 어디 있는지 알려주기..
사용자 인증? 토큰? JWT(Json Web Token)란 뭘까?
들어가는 말 저는 유지보수 업무를 주로 해왔었기 때문에 사용자 인증하는 절차나 관련 기술, 정의 등등에 대해 간단히 "그런게 있다더라~ 카더라~"로만 알고 있었는데, 이번에 회사에서 관련된 작업을 진행하게 되어 정의에 대해 알아보고자합니다. (이직하고 (변명)적응하느라 포스팅을 거의 안썼는데, 다시 마음을 잡고 간단한 글이라도 쓰려고 노력 중) JWS (Json Web Token) 정의 Json을 이용하여 사용자에 대한 속성을 저장하는 Claim 기반의 웹 토큰입니다. JWT는 토큰 자체의 정보를 담고 사용하는 Self-Containerd 방식으로 정보를 전달합니다. 여기서 클레임(Claim) 기반이란 무엇일까요? 클레임(Claim)은 주체가 수행할 수 있는 작업보다는 주체가 무엇인지를 표현하는 이름과 ..
Nuxt Universal Mode? (넉스트 유니버설 모드)
Nuxt 프로젝트를 설정하는 중에 Rendering mode에 대해 궁금증이 생겼다. SPA나 SSR 방식은 알고있다고 생각했는데, Universal은 뭘까? 간단히 알아보기로 했다. SSG (Server Side Generation or Static Side Generation) (참고: https://velog.io/@longroadhome/FE-SSRServer-Side-Rendering-%EA%B7%B8%EB%A6%AC%EA%B3%A0-SSGStatic-Site-Generation-feat.-NEXT%EB%A5%BC-%EC%A4%91%EC%8B%AC%EC%9C%BC%EB%A1%9C) Nuxt Universal Mode? 먼저 짧게 요약하자면 몇 가지 기능을 포함하여 SSR과 CSR 방식 둘 다 상..
[크롬 확장 프로그램 제작] 셋팅 방법
크롬 확장 프로그램을 아시나요? 크롬 확장 프로그램 프로젝트를 진행하기 위한 셋팅을 알아보겠습니다. 1. 프로젝트 CRA(create-react-app)로 시작 npx create-react-app extension-project 설치가 완료되면 구조가 이러합니다. 2. manifest.json 파일 수정 public > manifest.json { "name": "your project name", "icons": { "16": "icon-16x16.png", "48": "icon-32x32.png", "64": "icon-64x64.png", "128": "icon-128x128.png" }, "permissions": [], "manifest_version": 3, "version": "0.0.1"..