재밌는 Coding

1. 시험환경

    · 윈도우

    · node v20.15.0

    · npm 10.7.0

2. 목적

    · next.js 프로젝트를 신규 생성하는 방법을 알아보자.

3. 적용

    ① 프로젝트 폴더를 생성한다.

        - 예시) nextjs 폴더를 생성한다.

    ② nextjs 프로젝트를 생성한다.

        - npx  create-next-app@latest  ./nextjs

    ③ 설치한 의존성 라이브러리를 선택하면 설치가 진행된다.

    ④ 프로젝트를 실행한다.

        - npm  run  dev

4. 결과

1. 시험환경

    ① 워드프레스 최초 설치 후 관리자 계정의 PW는 시스템에서 무작위로 할당한다.

        - 최초 PW 예시 : Q14*6!%Hdjrj*YCaw

    ② 최초 발급받은 패스워드는 관리가 어려우므로 로그인 후 변경해보자.

        - http://localhost:8080/wp-admin

    ③ 로그인 후 오른쪽 상단에 "프로필" 클릭 후 나타나는 팝업메뉴에서 [편집]을 클릭한다.

    ④ 본문에 나타나는 화면에서 [새 비밀번호 설정] 버튼 후 신규 비밀번호를 입력한다.

    ⑤ 로그아웃 후 변경된 비밀번호로 다시 로그인한다.

1. 시험환경

    ˙ 윈도우 11

    ˙ MySQL 5.7

    ˙ Docker, Docker-Compose

2. 목적

    ˙ 도커, 도커컴포즈 기반으로 워드프레스를 설치한다.

    ˙ DB 및 Wordpress 데이터를 로컬 드라이브에 별도로 저장한다.

3. 적용

    ① 윈도우 운영체제에 도커 데스크탑이 설치 및 실행된 상태이어야 한다.

        - URL : https://www.docker.com/products/docker-desktop/

    ② 도커 컴포트 파일을 구성한다.

        - DB와 Wordpress의 데이터를 윈도우 로컬 디렉토리로 마운트 설정한다.

        - 아래 양식에서 <<Window 로컬 디렉토리>> 부분을 마운트할 경로로 대체하여 작성한다.

    ③ 도커 컴포즈를 실행한다.

        - docker-compose  -f  [파일명].yml  up

    ④ 도커 데스트탑에서 "Running" 상태인지 확인한다.

    ⑤ 워드프레스에 접속하여 초기 설치를 진행한다.

        - http://localhost:8090 (여기서는 Local 접속 8090 포트 사용)

4. 결과

    ˙ LocalPC Mount 경로에 저장된 DB 데이터

    ˙ LocalPC Mount 경로에 저장된 WP 데이터

1. 쿠키

    ˙ 사용자가 특정 웹 사이트에 접속할 때, 사용자의 컴퓨터에 저장하는 기록 파일

    ˙ ex) 로그인 시 ID와 PW 저장을 체크한 후 사이트 재접속 시 ID/PW를 기억하는 기능

2. 세션

    ˙ 서버에서 가지고 있는 객체(Object)로써, 특정 사용자의 로그인 정보를 유지하기 위해 사용하는 기술
    ˙  서버는 접속한 클라이언트에게 세션ID와 회원정보를 매핑하여 기록하고 Session ID를 부여하면,
    ˙  사용자는 접속할 때마다 발급받은 Session ID와 함께 요청(Request)한다.
    ˙  ex) 웹 사이트 로그인 후 다른 페이지 이동마다 접속 상태 유지하는 역할

    ① 장점

        - 개인정보가 포함되지 않은 세션ID(회원 식별 목적)를 사용자에게 제공하고, 회원 중요정보는 서버가 갖고 있음.

    ② 단점

        - 악의적인 공격자가 세션 ID를 탈취할 수 있음.

        - 웹 서버에서 세션 정보를 기록하고 있어야 하므로, 접속자가 많을 때 서버 메모리 부하 문제가 발생할 수 있음.

3. 세션과 쿠키의 관계

    ˙ 세션 ID는 일반적으로 쿠키에 저장되며, 세션 쿠키라고도 불린다.  

    ˙ 브라우저는 이 세션 쿠키를 갖고 있으면서 서버와의 상호 작용을 통해 세션 상태를 유지한다.

    ˙ 주로 사용되는 쿠키 타입은 HttpOnly 속성이 설정된 쿠키이며, JavaScript에서 쿠키에 접근하는 것을 방지하여 보안을 강화할 수 있다.
    ˙ SpringBoot에서도 세션 관리를 위한 설정이 가능하며, 세션 ID를 쿠키에 저장/유지하는 방식을 선택할 수 있다.

1. 시험환경

    ˙ AWS EC2, EIP

    ˙ 가비아 도메인 구매

2. 목적

    ˙ EC2에 EIP를 할당하여 고정 IP를 설정한다.

    ˙ 가비아에서 구매한 도메인과 고정 IP를 연결하여 URL로 EC2에 접속하는 방법을 알아보자.

3. 적용

    ① "탄력적 IP 주소"를 EC2에 할당한다.

        - 할당 받은 IP주소를 고정으로 사용하여 EC2에 접속할 수 있다.

    ② EC2에 Nginx를 설치하고 기동한다.

        - 참고 : https://languagestory.tistory.com/189

    ③ "My가비아 서비스 관리" 페이지에서 네임서버를 설정한다.

        - 네임서버 변경없이 gabia 기본 제공 서버를 사용한다.

    ④ "My가비아 서비스 관리" 페이지에서 DNS를 설정한다.

        - EC2의 고정 IP를 등록한다.

4. 결과

    ˙ 잠시 기다린 후 브라우저에 DNS 주소를 입력하여 EC2에 접속되는 것을 확인한다.

1. 시험환경

    ˙ 인터넷

    ˙ 소유 도메인

2. 목적

    ˙ 네이버 검색엔진 노출을 위해 특정 URL을 등록한다.

3. 적용

    ① 자신이 소유한 도메인을 등록하기 위해 접속 및 로그인한다.

        - URL : https://searchadvisor.naver.com/

    ② "웹마스터 도구 사용하기" 버튼을 클릭한다.

    ③ 자신이 소유한 URL을 등록하고, "소유확인 진행" 링크를 클릭한다.

    ④ URL이 등록된 것을 확인한다.

1. 시험환경

    ˙ 구글 서치 콘솔

    ˙ 소유 도메인

2. 목적

    ˙ 구글 서치 콘솔에 특정 도메인을 등록한다.

3. 적용

    ① 구글 서치 콘솔 사이트에 접속한다.

        - URL : https://search.google.com/search-console/about?hl=ko 

    ② "시작하기" 버튼 클릭 후 로그인한다.

    ③ 좌측상단 "속성 검색"을 클릭하고 "+ 속성 추가"를 클릭한다.

    ④ 등록할 URL을 입력한다.

    ⑤ 태그를 복사하여 main 페이지에 추가한다.

    ⑥ URL이 등록된 것을 확인한다.

1. 시험환경

    ˙ 인터넷

2. 목적

    ˙ 검색 엔진 노출을 위한 사이트맵 파일(sitemap.xml)을 생성한다.

3. 적용

    ① 무료 사이트맵 생성 파일 제공 URL

        - http://www.web-site-map.com

        - https://www.xml-sitemaps.com

        - https://xmlsitemapgenerator.org

        - https://xmlsitemapgenerator.org

        - http://www.check-domains.com/sitemap

    ② 위 사이트에서 생성한 sitemap.xml 파일을 호스팅 root 경로에 업로드한다.

        - github pages 기능으로 웹 호스팅을 하는 경우 Repository root  경로에 업로드하였다.

    ③ 구글 서치 콘솔 등 검색엔진 노출을 위해 사이트맵 경로를 등록한다.

4. 결과

    ˙ 검색 엔진 노출 결과를 확인한다.