[TMDB] The Movie Database API Key 발급받는 법(무료, 개발용)
·
WEB DEV
The Movie Database (TMDB) https://www.themoviedb.org/ 'The Movie Database'는 전 세계 영화, TV 프로그램이 정리된 방대한 사이트입니다. 너무나도 감사하게도, 사람들이 고생해서 별도의 DB를 만들지 않고도 본인들의 DB를 이용할 수 있게, API를 제공합니다. 그리고 이 API를 이용하기 위해서는, 개발자 개인별로 발행되는 'API_KEY'가 필요합니다. TMDB API Key 발급 받는 법 1. TMDB 사이트 가입부터 우선, 필수선행 조건. TMDB 사이트에 가입부터 해야 합니다. 2. API 발급 페이지로 이동하기 프로필 > 설정 > API로 이동합니다. 최종 도달하는 URL : https://www.themoviedb.org/set..
[favicon] 파비콘의 유래, 권장 규격, 그리고 만드는 법
·
WEB DEV
파비콘 (favicon) favorite icon의 줄임말이라고 하네요.저도 검색해보고 처음 알았습니다. 이제는 고인이 되어버린, 인터넷 익스플로러....IE 5 시절에 즐겨찾기를 하면 옆에 따라붙는 아이콘이라서 파비콘이라고 하네요. 요즘은 없으면 허전한거 같아요. 여러개의 탭을 열어놨을 때도 구분이 쉽고,사이트의 정체성을 나타내기도 하고요. 특히, 구글 크롬에서는 브라우저의 홈 화면에서 뜨기도 해서은근히 신경이 쓰이는 부분입니다. 파비콘의 규격 (확장자, 권장 사이즈) 전통적으로 기본 확장자는 .ico 요즘은 png, svg도 지원한다고 합니다. 파비콘의 기본 사이즈는 16x16 pixel 인데,앞에서 살펴본 것처럼 사이트의 정체성을 대표하는 성격이 점점 강해져서 한번 만들 때, 동일한 이미지로다..
[tree] 프로젝트 구조를 트리로 보여주고, txt 파일로 저장하기(커맨드 라인 툴)
·
WEB DEV
프로젝트의 코드 구조를 터미널에서 파악하고 싶을 때,혹은 트리구조를 txt파일로 만들어서 공유하고 싶을 때 유용한 tree라는 앱이 있습니다. 설치하기 맥에 이미 홈브루가 설치되어 있다면, 터미널에서 아래 명령어로 설치가 가능합니다. brew install tree 아래와 같은 화면이 나오면서 설치 완료! 이제 원하는 위치에 가서 아래 명령어를 치면, 해당 폴더에 있는 파일들의 구조가 트리형식으로 표현이 됩니다. tree 필수 Tree 명령어 그냥 tree 명령어를 치면, 모든 하위 폴더 안의 내용까지 다 나오기 때문에 몇 가지 옵션 명령어를 익혀두면 편합니다. 1. 기본 : 모든 구조를 다 보여준다. tree 2. 디렉토리들만 보기 : 프로젝트 구조분석에 좋다. tree -..
[.env] dotenv 파일 내에서 주석 처리하는 법과 주의사항
·
WEB DEV
.env 파일이란 무엇인가? .env 파일 형식은 간단한 key=value 쌍으로 이루어진 텍스트 파일이다 시스템의 환경 변수를 정의하는 데 사용되는 셀 스크립트 문법에서 유래했다고... .env는 'enviroment'의 약자인 것. .env 파일 형식을 사용하는 이유 보통 API_KEY를 저장한다던지, DATABASE_URL을 적어두는데 많이 사용한다. 민간함 정보를 코드에서 분리하여 하드코딩하는 것을 방지하는 목적이다.API_KEY=YOUR_SECRET_KEYDATABASE_URL=postgres://user:password@host:port/dbname .env 파일 작성하는 법 위처럼 변수 이름은 대문자와 언더스코어(_)로 구성하는 것이 관례다. 관례는 적당히 따라줘야 간지라는 ..
마크다운 에디터에서 문단 구분선 입력하는 법(GitHub에서 readme 파일 편집)
·
WEB DEV
GitHub에 있는 리드미(readme) 파일은 마크다운 서식을 사용한다. * 참고로 readme 파일은 VSCode에서 직접 수정할 수도 있고, GitHub에서 수정할 수도 있다. Next.js로 프로젝트를 생성한 경우에, readme에 자동으로 실행방법 등이 기재되어 있을텐데, 이 내용은 살려두고, 그 위에 자신의 메모를 입력하고 싶을 수 있다. 그럴 때, 문단 구분선으로 ***. ---, ___ 등의 구분자를 사용할 수 있다. 나는 ___ 방식을 쓰는 편 참고로 이렇게 GitHub 홈페이지에서 직접 리드미 파일을 수정해줬다면, 맥 VSCode 터미널이나, 맥 터미널(프로젝트가 있는 폴더에서) 아래 명령어를 쳐서, 로컬-GitHub에서 쓰는 프로젝트 파일을 동기화 시켜줄 필요가 있다...
[Next.js] Next.js 새 프로젝트 생성하는 법+옵션선택(Step by Step)
·
WEB DEV
사전 준비 사항npm과 Node.js는 당연히 설치가 되어 있다고 가정합니다.나한테 Node.js가 있는지 없는지, npm이 있는지 없는지 모른다면 아래 글 참조https://spacechild.net/607 프로젝트 생성하기 1. 프로젝트(폴더)를 생성할 폴더로 이동한다 저는 보통은 Projects/ 밑에 프로젝트 폴더를 만드니까, Projects 폴더로 이동합니다. Next.js는 프로젝트 생성 명령어를 치면, 프로젝트가 생기면서 자동으로 폴더가 생성이 됩니다. 해당 폴더가 곧 프로젝트인 개념입니다. 2. 프로젝트 생성 명령어 실행 터미널에 아래 명령어 중 하나를 칩니다. 제일 많이 쓰는 건 npm 방식# npmnpx create-next-app@latest my-app# pnpmpnpm c..