'Computer Science/Web' 카테고리의 글 목록

Computer Science/Web

Covenant

개발자를 위한 SEO 실전 가이드 2부: sitemap과 robots.txt로 발견 경로 설계하기

2026.09.14

시작하며1부에서는 검색엔진 노출이 URL 발견, 크롤링, 색인, 노출의 순서로 진행된다고 정리했습니다. 이번 글은 그 첫 단계인 발견을 실제로 설계하는 방법입니다.서비스가 커질수록 URL은 생각보다 빠르게 늘어납니다. 상품 상세, 게시글, 행사, 채용 공고, 사용자 프로필처럼 데이터에서 만들어지는 페이지가 대표적입니다. 화면에서 잘 열리는 것과 검색엔진이 그 페이지를 빠짐없이 발견하는 것은 별개의 문제입니다.이때 주로 등장하는 파일이 sitemap.xml과 robots.txt입니다. 이름은 익숙하지만 역할을 반대로 이해하면 SEO를 오히려 어렵게 만들 수 있습니다. sitemap은 중요한 URL을 알려주는 목록이고, robots.txt는 크롤러의 요청 범위를 관리하는 규칙입니다. 둘 다 검색 결과에서 페..

개발자를 위한 SEO 실전 가이드 1부: 검색엔진은 내 페이지를 어떻게 찾고 읽을까

2026.09.14

시작하며 서비스를 만들고 배포한 뒤에는 이상하게 답답한 순간이 있습니다. 주소를 직접 입력하면 잘 열리고, 목록에도 콘텐츠가 보이는데 검색 결과에서는 아무것도 찾을 수 없는 경우입니다. 이때 가장 먼저 떠올리는 것은 보통 제목, 키워드, 설명문입니다. 물론 중요합니다. 하지만 그보다 앞에 확인할 일이 있습니다. 검색엔진이 그 URL의 존재를 알고 있는지, 페이지를 읽을 수 있는지, 그리고 읽은 결과를 색인으로 저장했는지입니다. 이번 글은 SEO를 처음 접하는 개발자를 위해 이 과정을 정리한 첫 번째 글입니다. 순위 비법을 이야기하기보다, 검색엔진이 웹 페이지를 만나는 순서를 먼저 살펴보려고 합니다. 다음 글부터 sitemap, robots.txt, canonical, 메타데이터를 각각 다루겠지만, 이 흐..

완벽정리! npm에서 pnpm으로 이사해야 하는 이유

2025.10.09

시작하며 벡엔드 개발자이긴 하지만, 팀에서 관리하는 리엑트로된 서비스가 있습니다. 기존 npm에서 pnpm으로 전환하는 작업을 해보았습니다. pnpm이 제공하는 디스크 공간 절약, 빠른 설치 속도, 그리고 안정적인 의존성 관리의 이점들을 익히 들어왔기에 기대가 있었습니다. 마이그레이션 이후 기대했던 만큼의 드라마틱한 개선은 없었습니다. 그럼에도 불구하고 왜 pnpm이 npm보다 더 나은 선택인지 깊이 있게 공부하며 알게 된 내용들을 정리해보고자 합니다.패키지 매니저란? 현대적인 개발 환경에서는 프로그래밍 언어를 막론하고 패키지 매니저(Package Manager) 사용합니다. 패키지 매니저는 이름 그대로 프로젝트에 필요한 각종 패키지(라이브러리, 프레임워크 등)를 효율적으로 관리해 주는 도구입니다. 개발..

REST란? REST API 디자인 가이드

2021.05.09

REST란? REST API 디자인 가이드시작하며작년 저의 커리어의 첫 번째 회사인 스타트업 입사 첫날 사수님이 REST API를 구현해본적이 있냐고 물어보셨습니다. 그런 경험이 없다고 하니 REST API 디자인 가이드 글을 읽어보라고 주셨고 이렇게 REST API의 첫 만남을 시작하여 퇴사하기 전까지 주어진 중요한 일은 프론트와 API 스팩을 정하는 것이었습니다. 한번 스팩을 정하면 벡엔드 개발자인 저만 바꾸어야 하는 것이 아닌 프론트에도 영향이가니 신중함과 검토와 소통의 연속이었습니다. 당시 어떻게 개발해야할까 검색과 고민한 내용을 재구성하여 작성해봅니다. 참고 링크는 글의 후미에 작성하였습니다.REST란?REST는 웹의 창시자(HTTP) 중의 한 사람인 Roy Fielding(로이 필딩)이 200..

org.apache.coyote.http11.HeadersTooLargeException 에러 해결

2021.03.19

org.apache.coyote.http11.HeadersTooLargeException 에러 해결 -->문제 상황org.apache.coyote.http11.HeadersTooLargeException: at org.apache.coyote.http11.Http11OutputBuffer.checkLengthBeforeWrite(Http11OutputBuffer.java:551) at org.apache.coyote.Response.action(Response.java:208) at org.apache.coyote.http11.Http11OutputBuffer.write(Http11OutputBuffer.java:476) at org.apache.coyote.Respo..

GO 언어로 JWT 인증서버 만들기

2020.09.17

GO 언어로 JWT 인증서버 만들기시작하며본 글은 nexmo.com blog 글을 번역한 글입니다. 하지만 다음과 같은 차이점이 있습니다.원글 글쓴이 코드의 버그를 수정하였습니다. 원글에서 모든 구현이 하나의 main.go에 구현되었습니다. 역활에 맞추어 router, model, controller, request, response 파일로 분리하였습니다. 설명에 불필요한 수식어를 드러내며 글쓴이의 글을 윤문 하였으며, 많은 부분 초월 번역 하였습니다. 글쓴이가 사용한 Redis GUI 프로그램인 Redily는 지금 시점에서 사용할 수 없는 프로그램입니다. P3X Redis로 스크린샷을 교체하였습니다. JWT 기반 인증 서버를 구현하고 싶은 분들에게 가뭄에 단비 같은 글이 되기를 바랍니다.JWT?✨ 제 ..

[Node.js] 에러처리 (Page Not Found)

2020.05.24

[Node.js] 에러처리 (Page Not Found) Source. freepik.com기본 코드 npm initNode.js 애플리케이션을 초기화하고 package.json 파일을 생성합니다. 📂Root|├── 📂 node_modules ├── 📂 controllers| └── 📄 errorControllers.js 작업할 디렉토리 구조는 위와 같습니다. 완성 코드 Github 에서 확인하세요.const express = require('express');const app = express();const PORT = 5003;app.get('/', (req, res) => res.send("Hello World!"))app.listen(PORT, () => { co..

node.js Could not connect to any servers in your MongoDB Atlas cluster. 에러 해결법

2020.05.16

오류 메세지 Nodejs로 mongo db를 연결하다가 처음 만나는 에러를 보았습니다. message: 'Could not connect to any servers in your MongoDB Atlas cluster. Make sure your current IP address is on your Atlas cluster\'s IP whitelist: https://docs.atlas.mongodb.com/security-whitelist/.', 해결 방법 오류메시지대로 white list 작업을 해야합니다. ADD IP ADDRESS 를 클릭합니다. ADD CURRENT IP ADDRESS 클릭, Whitelist Entry에 입력되는 IP 주소를 확인하고 Confirm을 누릅니다.Pend..

☁ Auzer를 이용하여 Django 배포하기 - [2부]

2019.08.26

Auzer를 이용하여 Django 배포하기 2편 Server 설정 Auzer 19.08.26버전을 기준으로 작성하였습니다.Django 2.2.4 버전을 기준으로 작성하였습니다.본 글에서 사용하는 예제는 여기 주소입니다.리소스로 이동을 클릭합니다.공용 IP주소를 확인합니다.> ssh apple@52.231.64.145Auzer에서 가상머신을 만들 때 입력했던 사용자 이름과 암호를 입력합니다.The authenticity of host '52.231.64.145 (52.231.64.145)' can't be established.ECDSA key fingerprint is SHA256:yRS1G7YZ49OFOovDQ5B1PRQTQHrsaIbxs4Mb*****.Are you sure you want to co..

☁ Auzer를 이용하여 Django 배포하기 - [1부]

2019.08.26

Auzer를 이용하여 Django 배포하기 1편 Auzer 설정 Auzer 19.08.26버전을 기준으로 작성하였습니다.Django 2.2.4 버전을 기준으로 작성하였습니다.본 글에서 사용하는 예제는 여기 주소입니다.소개AWS를 이용한 배포에 관한 글은 많으나, Auzer를 이용한 배포는 거의 전무합니다.Auzer를 이용하여 Django를 배포할 수 있습니다.사실상 가상 인스턴스 만드는 부분만 AWS EC2를 사용한 배포와 차이점입니다.가상 인스턴스 안에서 Django 프로젝트를 배포하는 부분은 AWS와 별반 다를바 없습니다.본 포스트가 Auzer를 이용해서 배포하려는 분들에게 가뭄에 단비 같은 존재가 되기를 바라고 있습니다.cmder 설치하기 ssh연결을 위해서를 설치할 것입니다. cmder.zip (..

[Django 오류]django.db.migrations.exceptions.InconsistentMigrationHistory: 오류 발생시

2017.08.06

python3 manage.py makemigrations를 하면django.db.migrations.exceptions.InconsistentMigrationHistory: Migration hitcount.0001_initial is applied before its dependency base.0001_initial on database 'default'. 과 같은 오류가 나온다. 이 때 해결법은 각 앱에 있는 migrations폴더 아래에 __init__.py 파일 빼고 나머지 파일만 삭제, 다시 python3 manage.py makemigrations를 입력하면 된다.

[Django]장고 디버그 툴

2017.08.04

django-debig-toolbar- 장고 디버그 툴바는 현재 request/response에 대한 다양한 디버깅 정보를 보ㅇ준다.- SQLPanel을 통해 각 요청 처리 시에 발생한 SQL 내역 확인 가능하다.- 응답속도가 짧을 수록 웹 서비는 빠릿빠릿해진다. django-debug-toolbar 설치pip install django-debug-toolbar를 커멘드라인에 입력하여 디버그 툴바를 다운로드 한다. setting.py설정# 프로젝트/setting.pyINSTALLED_APPS = [ ..., "debug_toolbar"]MIDDLEWARE = ["debug_toolbar.middleware.DebugToolbarMiddleware", ...]INTERNAL_IPS = ["127.0.0....

[Django]url

2017.08.03

URLSConf- 프로젝트/settings.py에 최상위의 URLconf 모듈을 지정한다.ROOT_URLCONF = '프로젝트.urls'- 특정 URL과 뷰 매핑 List- 장고 서버로 Http 요청이 들어올 떄마다 URLConf 매핑 List를 처음부터 끝까지 순차적으로 훝으면서 검색한다.- 매칭되는 URL Rule 을 찾지 모샣ㅆ을 경우 404 Page Not Found 응답을 발생시킨다. URLConf 정규표현식 매핑- (?P) : 이 영역의 문자열에 정규 표현식을 적용해서- \d+ : \d+의 패현에 일치하면- : x라는 변수명으로 인자를 넘기겠다. - view의 인자로 넘겨받은 값들은 모두 문자열 타입니다. 새로운 장고 앱을 생성할 때, 추천하는 작업의 순서1. 앱 생성 : python3 ..

Django 배포하기

2017.07.31

127.0.0.1로 테스트를 했다고 하면 이제 다른 사람이 내 웹 사이트에 접속할 수 있도록 하는 것을 배포한다고 합니다. 그런데 그러기 전에 장고에서 설정을 해 주어야 합니다. 1. 배포[1] 개발환경 : 프로그램 성능은 낮더라도 개발 생상성에 집중한다.특징 : 파이썬 소스파일에서 소스 코드 변경시, 개발서버가 자동 재시작 합니다. static/media 파일을 장고에서 직접 서빙 지원오류 발생시, 오류정보 직접 노출[2] 서비스 서버환경 : 프로램 성능을 최적화 합니다.특징 : 소스코드가 변경되더라도 개발서버가 자동 재시작 되지 안흔다.static/media 팡리은 장고에서 직접 서빙하지 않는다. 이는 외부 웹 서버에 맡겨야 한다. 오류가 발생하더라도 오류 정보를 직접 노출되지 않는다. 2. 서비스 ..

Django와 Apache2연결하기

2017.07.31

아마존AWS를 이용하여 Ubuntu에서 Django와 Apache2를 연결하겠습니다. Apache2와 Djando를 연결하는 이유는 django에서 python manage.py runserver 를 해서 접속할 수 있지만 이는 테스트 서버입니다. 따라서 여러 사림이 들어올 경우 django는 안정성을 보장할 수 없습니다. 따라서 apache2와 연결하는 것입니다. 1. 필요한 팩키지 다운로드apt-get updateapt-get upgradeapt-get install apache2pip3 install Django==1.11.3apt-get install libapache2-mod-wsgi-py3apt install python3-pip pip3 install --upgrade pip 2. set..

[CSS기초]박스모델

2017.07.28

블록레벨(block-lebel) 요소 태그를 사용해 요소를 삽입했을 떄 혼자 한 줄으르 차지하는 요소해당 태그 : , ~, , , , , ,, ,, 인라인 레벨(inline-level) 요소줄을 차지하지 않는 요소. 화면에 표시되는 콘텐츠만큼만 영역을 차지하고 나머지 공간에는 다른 요소가 올 수 있다. 해당 태그 : , , , , , , , , , 박스 모델(box model) 요소- 위의 블록 레벨 요소들은 모두 박스 형태이다. 예를 들어 태그를 사용하는 텍스트 단락은 블록 레벨 요소인데 텍스트 단락 앞뒤에 빈 줄이 생기면서 텍스트 단락이 하나의 박스 형태를 가진다 - width, height속성 : 콘텐츠 영역의 크기width: 크기 | 백분율 | autoheight: 크기| 백분율 | auto- ..

[CSS기초]04 글꼴 관련 스타일

2017.07.28

font -family 속성 - 글꼴 지정하기예] p {font-family: 굴림;}- 웹 문서에서 글꼴을 지정할 때는 한 자기 글꼴만 지정하기도 하지만 지정한 글꼴이 없을 경우에 대비해 두 번째, 세 번째 글꼴까지 지정해야 한다. 두 개이 상의 글꼴 이름을 지정할 때는 글꼴 이름과 이름 사이의 ,로 구분한다.- 그러면 사용자 시스템에 없는 글꼴을 다른 글꼴로 대체하는 것이 아니라 그대로 보여주려고 하면 웹 폰트를 사용하면 된다. 웹 문서를 작성할 때 웹 문서 안에 글꼴 정보도 함께 저장 했다가 사용자가 웹 문서에 접속하면 글꼴을 사용자 시스템으로 다운로드시키는 방식이다. font-size 속성 - 글자 크기 조절하기- 단위em : 해당 글꼴의 대분자 M의 너비를 기준으로 크기를 조절한..

[CSS기초]03 캐스캐이딩 스타일 시트

2017.07.28

캐스캐이딩(Cascading)이란?위에서 아래로 흐르는 스타일 시트라는 뜻으로 스타일간 충돌을 막기 위해 위에서 아래로 흐르며 적용되는 방법이다.다음 두 가지 윈칙을 따른다.1. 스타일 우선순위 : 스타일 규칙의 중요도, 적용 범위에 따라 우선순위가 결정정되고 그 우선순위에 따라 위에서 아래로 스타일이 적용된다.2. 스타일 상속 : 타그들의 포함 관계에 따라 부모 요소의 스타일을 자식 요소로 위에서 아래로 전달한다.스타일 우선순위1. 중요도사용자 스타일 시트의 중요 스타일 > 제작자 스타일 시트의 중요 스타일 > 제작자 스타일 시트의 일반 스타일 -> 사용자 스타일 시트의 일반 스타일 > 브라우저 스타일 시트의 스타일최우선순위 우선순위 낮음2. 명시도인라인 스타일 > id 스타일 >..

[CSS 정리]02 주요 선택자

2017.07.27

도입 선택자는 태그 하나하나가 될 수 았지만 여러 개의 요소를 묶어 별도의 선택자로 지정할 수 있다. 이렇게하면 일일이 스타일을 지정하지 않고도 스타일을 쉽게 지정할 수 있다. 여기서는 주 되게 사용하는 선택자 5개를 알아보겠다.1. 전체 선택자(Universal selector) 전체 선택자는 모든 요소에 적용할 때 사용한다. 주로 하위 요소에 한꺼번에 스타일을 적용할 떄 사용한다. 전체 선택자로는 *를 사용한다. 문서의 여백이나 글꼴 크기등 기본 스타일을 초기화 할 떄 사용한다. 예를 들어 웹 문서를 브라우저에 표시할 때 문서 내용 바깥쪽에는 마진을 두고 문서 내용 안쪽에는 패딩이라는 여백을 두는데 이런 여백 때문에 디자인이 깔끔하지 않는 경우, 전체 선택자를 이용해 웹 문서 전체에 마진과 패딩 여..

[CSS 기초]01 CSS 적용하기

2017.07.27

웹 문서에서의 스타일 : HTML문서에서 자주 사용하는 글꼴이나 색상, 정렬, 각 요소들의 배치 방법 등 문서의 겉 표면을 결정짓는 내용들.CSS(Cascading Style Sheets) : CSS는 텍스트이 색상이나 크기, 이미지의 크기나 위치, 표 색상 배치 방법 등 웹문서의 디자인 요소를 담당스타일 형식- p { text-align : center } 선택자 스타일 속성 속성값- 속성과 속성값은 ;으로 구분한다. p { text-align : center; font-size: 16px }스타일 주석- /* */ 사이에 주석을 입력한다. 스타일을 어디에(html안, 혹은 별개의 파일, 혹은 바로 적용의 여부)적용하는 방법에 따라 3가지로 구분할 수 있다.1. 내부 스타일 시트 ..

Covenant

티스토리툴바