본문 바로가기

전체 글14

2020버전) 티스토리 검색엔진 최적화(SEO) - 구글 편(sitemap, rss) 검색엔진 최적화를 위한 글은 다음 순서로 이루어져 있다, 아래 순서대로 따라하면 된다. 티스토리 검색엔진 최적화(사이트맵 제작하기) 티스토리 검색엔진 최적화(구글 편) 티스토리 검색엔진 최적화(네이버 편) 구글에 나의 블로그가 검색이 되어야 할 텐데. 단순히 자신의 개인 기록 용도로 사용하는 사람이라면 모를까, 다른 사람이 내 글을 통해 무언가를 얻어가고자 하는 생각으로 블로그를 시작한 사람이기 때문에, 검색 엔진 최적화는 선택이 아닌 필수다. 내 블로그가 여러 검색 엔진들에 노출되는 방법을 차례대로 소개한다. 이번에는 구글 검색엔진에 내 블로그가 검색되게 하는 방법에 대해 알아보자. 1. 내 블로그가 구글에서 검색이 되는지 알아보는 법 site: bogmong.tistory.com 구글에 자신의 블로그.. 2020. 5. 12.
개발 환경 세팅 01. 어플리케이션 개발 스택 정리 환경 세팅이나 개발하는 전체 과정을 업로드할 생각은 없다. 큰 줄기에서의 흐름은 보여지겠지만, 대부분 Problem-Solving 경험에 대해서 메모를 남길 것 같다. Frontend: React, React Native (Expo 사용) Backend: Node.js ETC: Prisma (데이터베이스 ORM), GraphQL, TypeScript등등 GraphQL을 사용하면 대부분의 Redux code가 필요 없어진다(REST API로부터 받아오는 데이터를 컨트롤할 필요가 없어지기 때문에). React Native의 경우 Flow를 통해 타입 체크를 하는 것이 일반적이었으나, 이제는 TypeScript를 통한 타입 체크가 권장되고 있다. 사견. 원래는 Redux와 Saga를 이용해서 REST API .. 2020. 3. 13.
React & Styled-Component - 재사용성 높히는 방법 고찰 코드만 보고 싶다면? 가장 아래에 있는 코드샌드박스 확인하기 한 화면에 세로로 나열되는 버튼의 개수에 따라, 버튼의 사이즈를 조절해 보고 싶었다. SASS를 사용할 때를 기억하여 "how to use variables in styled components?" 로 검색해 보았으나 최신 자료가 잘 안 나와서, 공식 문서를 참고하여 props를 이용해서 구현해 보았다. 버튼이 두개일 때는 height: 60px를, 버튼이 네개일 때는 height: 40px를 주고 싶다. 현재 이 프로젝트에서는 React, Styled Components를 사용하고 있다. 1.재사용 할 법한 css 속성들을 js 파일로 분리한다. 여기까지는 쉽다. 그냥 객체를 export 하는 코드이다. variable.js const var.. 2019. 12. 22.
Axios Response header의 값이 없는 경우에 대해 어떤 상황의 어디에 영향을 미치는 문제인가요? - WHO AND WHAT React에서 axios 라이브러리를 사용했다. POST의 Response를 받기 위해 다음과 같은 코드를 사용했다. API 서버에서 Header에 standard header가 아닌 우리가 정의한 information을 추가로 정의해서 보낸다. "Authorization" 필드를 추가해서 보내는데, 분명히 postman에서는 잘 표시되고 있고, 크롬 개발자 도구의 네트워크 탭에서도 헤더 값의 필드를 확인할 수 있는데 React 클라이언트에서는 안 보였다. 클라이언트는 baseURL 등 공통적으로 정의한 세팅을 편하게 하기 위함이다. client.js import axios from 'axios'; const client = axi.. 2019. 11. 12.