본문 바로가기

전체 글76

Open Graph : Metadata Facebook 이 제안한 프로토콜로 이중 메타데이터에 대한 부분을 신경써야 한다. 오픈그래프 태그가 잘 구성되어 있으면, 주변에 공유할 때 풍성한 컨텐츠를 보여줄 수 있다. 카카오톡에서 링크를 공유했을 때, 링크만 공유했는데도 예쁘게 사진이나 타이틀 등이 표시되는 것. 그것이 오픈 그래프이다. 태그를 사용해서 웹 페이지의 상단에 추가해주면 되며, Open Graph 사이트에는 IMDB 사이트를 예시로 들고 있다. ... Basic Metadata 기본이 되는 메타데이터로 제목, 타입, 이미지, URL이 포함된다. IMDB에서는 아래와 같이 사용되었다. og:title - The title of your object as it should appear within the graph, e.g., "The .. 2022. 9. 19.
SEO(Search Engine Optimization) Tip SEO : 말 그대로 검색엔진 최적화이다. Tip Cross linking : A라는 문서가 여러 페이지 내에 링크가 되어 있음 title tag and meta description : Title과 meta 태그가 잘 표시되어 있음 URL canonicalization : URL 정교화 2022. 9. 16.
PoC 와 Prototype PoC : Proof of Concept. 기술적인 관점에서 실현이 가능한가. 최우선 목표 : 프로젝트의 불확실한 요소를 제거하는 것 How : 구현 가능한 기술과 구현 가능성이 [미지수]인 알 수 없는 기술을 분리한다. [미지수] 실현 가능한 기술인가? 성능이 필요한 수준인가? Prototype : 아이디어를 실체화 하는 것 실체를 만들어 아이디어의 정합성을 확인하는 것이 목표이기 때문에 구현 방법과 기술이 중요하지 않다. 비즈니스적인 측면에서 이게 매력적으로 보이는지 안 매력적으로 보이는지 확인 가장 중요한 것 : 시간. 빨리 만들어서 아이디어의 효용성을 확인하는 것이 중요하다. 디자이너나 기획자들과의 이해관계에서 어려움이 있을 때, 프로토타입을 만들어서 설명하면 보다 도움이 된다. 2022. 9. 16.
RFC(Request for Comments) Request for Comments. 직역하면 의견을 기다리는 문서다. 개인 또는 회사에서 프로젝트할 때 RFC 문서를 작성하고 진행하면 보다 넓은 관점에서 피드백을 받을 수 있어 좋다. 형식은 특별히 없다. 강의에서는 아래와 같은 RFC 양식을 사용한다. Metadata Timeline Reseach, Develop, Release 기간을 명세한다. Reference 찾아본 레퍼런스 링크를 기입하면 나중에 도움이 된다. 개요 프로젝트의 목표를 기술한다. 내가 이해한 바로 재해석해서 작성해도 좋다. 목표 무엇을 달성하려고 하는지. Goal. 보통 관련 부서에서 전달 받아서 작성. 목표의 우선순위(Priority)를 표기해 둔다. 요구사항 구체적인 방법. #Required #Optional 한 요구사항들.. 2022. 9. 15.
Access-Control-Request-Private-Network 헤더 Chrome 98버전부터 CORS 관련 정책이 강화됨에 따라 문의가 간간이 들어온다. 그 중 오늘은 Access-Control-Request-Private-Network 관련해서 짚어볼까 한다. https://wicg.github.io/private-network-access/ Private Network Access Abstract This document specifies modifications to Fetch and HTML which are intended to mitigate the risks associated with unintentional exposure of devices and servers on a client’s internal network to the web at large... 2022. 9. 14.
TypeError Cannot read property 'setState' of undefined 주로 React Hook 을 사용해서 컴포넌트를 제작하는데 가끔 하나의 컴포넌트에 여러 state가 필요할 때 Class 컴포넌트로 작성하곤 한다. 처음으로 Typescript로 Class형의 컴포넌트를 만드는데 제목과 같은 오류가 발생했다. 해결방법은 간단하다. class 내 function 들을 화살표 함수로 작성해주는 것! (https://devlog.jwgo.kr/2018/08/20/set-state-undefined-error-in-react/) 바인딩이 안 되어서 그렇다는데 굳이 이걸 하나씩 .bind함수로 묶어주는 것보다는 화살표로 간단하게 쓰겠다. 2022. 2. 10.