younghlee 님의 블로그

웹 서버에서 회원 인증을 구현하려면 회원 정보를 저장할 데이터베이스를 준비하고, 회원 가입과 로그인 절차를 통해 사용자를 인증하는 구조가 필요합니다. HTTP 기반 웹 서버는 요청과 응답이 끝나면 연결 상태를 기억하지 않기 때문에 Stateless 환경으로 분류됩니다. 반대로 SSH 서버처럼 한 번 로그인하면 연결이 유지되고 같은 세션 안에서 상태가 계속 이어지는 방식은 Stateful 서버라고 할 수 있습니다. nginx와 같은 웹 서버는 매 요청이 서로 독립적으로 처리되므로, 현재 어떤 사용자가 접속해 있는지 자체적으로 알 수 없습니다. 이 때문에 웹 서버와는 별도로 “어떤 사용자가 어떤 상태로 접속해 있는지”를 관리하는 장치가 필요합니다. 클라이언트에 정보를 저장하면 서버 자원 부담은 줄어들지만, ..

회원 가입register.php이제 회원 관리 코드를 작성해 보겠습니다.먼저 사용자 등록을 위한 register.php로 이 페이지를 통해 새로운 사용자의 등록이 가능합니다.먼저 새로운 사용자 등록을 위한 html 코드는 다음과 같습니다. 회원 가입 이메일: 비밀번호: 이름: 회원가입 태그에 이메일 주소, 암호 그리고 사용자 이름을 입력한 후 POST 방식으로 호출하는데 action 속성을 따로 지정해 주지 않았기에 해당 값으로 register.php 자신을 호출하게 됩니다. 이제 POST 호출된 값들을 처리하는 php 코드를 html 코드 이전에 다음과 같이 작성합니다.모든 항목을 입력하세요."; } else { ..

이제 데이터베이스를 연결하여 인증을 하는 과정에 대해 생각해보자. 먼저 회원 테이블은 다음과 같이 구성합니다.CREATE TABLE `users` ( `id` INT NOT NULL AUTO_INCREMENT, `email` VARCHAR(255) NOT NULL, `password` VARCHAR(255) DEFAULT NULL, `name` VARCHAR(100) NOT NULL, `provider` ENUM('local','google','facebook') NOT NULL DEFAULT 'local', `provider_id` VARCHAR(255) DEFAULT NULL, `created_at` DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP, `up..

앞에서 웹화면을 구성하기 위해 정적 웹페이지(HTML)을 사용하였습니다. 웹 서버는 미리 만들어진 정적 페이지를 브라우저를 통해 우리에게 보여줍니다. 반면, 사용자의 상태나 입력에 따라 내용이 바뀌는 페이지를 동적 웹페이지라고 합니다. 예를 들어 로그인한 사용자의 이름을 표시하는 “***님, 안녕하세요.” 같은 문구가 그 예죠. 예전에는 CGI(Common Gateway Interface) 를 통해 웹서버가 외부 프로그램(C, Java 등)을 실행해 결과를 HTML로 보여줬습니다. 하지만 매번 별도 프로그램을 빌드·배포하는 부담이 컸고, 그래서 PHP 같은 서버 사이드 스크립트 언어가 널리 쓰이게 됐습니다. PHP는 HTML 안에서 직접 실행되어 동적인 콘텐츠를 쉽게 생성합니다. 간단한 예제들을 통해,..

앞에서 알려준 docker-compose.yml이 실행중이라면 docker ps 명령어를 통해 살펴보면 mySQL은 현재 docker을 통해 사용할 수 있습니다. 이제부터 mySQL에 접속해서 직접 DB를 다루면서 SQL에 대해 배워보는 시간을 가져보겠습니다. mySQLdocker exec -it mysql bashdocker exec 명령으로 실행중인 mysql로 먼저 컨테이너 내부로 들어갑니다 mysql -u root -p그리고 mysql 서비스에 접속하기 위해 해당 명령어를 실행하고 암호를 입력합니다. (암호: youngho) (youngho에 대한 설정은 docker-compose.yml에 정의되어 있습니다.)mysql로 접속되면 프롬프트가 mysql>로 변경되면서 mysql을 사용할 수 있게 됩..

지난 시간에는 Docker Compose를 활용해 실습을 진행해 보았습니다.이번엔 실습에 진행한 코드를 바탕으로 풀이해 보면서 핵심 코드를 확인하는 시간을 가져보겠습니다. 내용을 진행하면서 중복이 되는 내용은 제거하면서 설명하도록 하겠습니다. docker-compose.ymlservices: nginx: image: nginx:latest restart: always container_name: nginx ports: - "80:80" volumes: - ./html:/var/www/html - ./nginx/default.conf:/etc/nginx/conf.d/default.conf - ./logs/nginx:/var/log/nginx ..

사용자 규모가 작은 웹사이트라면 하나의 웹 서버 컨테이너만으로도 운영이 가능합니다.하지만 서비스가 성장해 트래픽이 늘어나면 웹 서버 컨테이너를 2개, 3개로 늘려야 하는 상황이 발생합니다. 이때 컨테이너마다 bash 쉘로 접속해 nginx 설치, 설정 파일 수정 등 동일한 환경을 다시 구성해 줘야 하므로 관리가 번거롭습니다. 이러한 반복 작업을 자동화해 주는 도구가 바로 docker-compose입니다.docker-compose는 여러 개의 컨테이너를 하나의 애플리케이션처럼 묶어 관리할 수 있게 해 주는 도구로, 복수의 컨테이너 생성, 설정, 실행 과정을 자동화하고 손쉽게 관리할 수 있도록 도와줍니다.docker-compose 예를 들어 웹 어플리케이션을 테스트하려면 웹 서버 컨테이너와 데이터베이스 컨테..

선언부(declaratives)선언부(Declaration)에는 여러개의 속성과 속성값이 올 수 있고 ";"으로 나누어 표현합니다.또한 스페이스바( )를 이용해서 여러개의 class를 중첩해서 사용 가능합니다. CSS에 자주 사용되는 속성 width: 너비 지정 (예: 100px, 80%)height: 높이 지정 (예: 50px, 10vh)background-color: 배경 색상 지정 (예: yellow, rgb(255, 255, 0))margin: 외부 여백 지정 (예: 10px, 1rem)padding: 내부 여백 지정 (예: 5px, 0.5rem)border: 테두리 지정 (예: 1px solid black, none)border-radius: 버튼 모서리를 둥글게 만들기 (예: 5px)colo..

CSS는 HTML이나 XML과 같은 구조화된 문서를 화면이나 종이 등에 어떻게 렌더링할지 정의하는 언어입니다. CSS는 HTML 각 요소의 스타일(디자인, 레이아웃 등)을 정의하여 브라우저에게 화면 렌더링 방법을 알려줍니다. HTML과 CSS는 각각 고유한 문법을 가진 별개의 언어입니다. HTML은 CSS를 포함할 수 있지만, HTML 없이 단독으로 존재하는 CSS는 의미가 없습니다. CSS 기본 문법 CSS 문법은 선택자(selector)와 선언부(declaratives)로 구성됩니다.선택자 – CSS를 적용할 HTML 요소(element)선언부 – 하나 이상의 선언을 세미콜론(;)으로 구분하여 포함하며, 중괄호({ })로 감쌉니다.각 선언은 CSS 속성명(property)과 속성값(value)을..

웹 서버가 HTML 문서를 전송하면, 웹 브라우저는 이를 해석해 보기 좋은 형태로 화면에 표시합니다. HTML(HyperText Markup Language)은 웹 페이지의 구조와 내용을 표현하는 언어로, 하이퍼텍스트를 통해 다른 페이지로 이동하는 링크를 포함할 수 있습니다.일반 텍스트와 구별되는 HTML만의 가장 큰 장점이 바로 이 “링크” 기능이며, 덕분에 웹은 거미줄처럼 서로 연결된 거대한 공간이 되었습니다.html 기본HTML 문서는 보통 다음과 같은 기본 구조를 갖습니다. 큰 제목 여기는 본문의 내용이 들어갑니다. 다른 페이지로 가는 링크 이 문서가 HTML5 표준을 따른다는 선언으로 최신 버전의 HTML임을 나타냅니다. ... HTML 문서의 최상위 루트 요소로, 전체 내용을 감쌉니..