본문 바로가기

전체 글

 (297)
HTTP HTTPHypertext(HTML) Transfer Protocol(통신규약)tim berners-lee 웹 창시자 : 웹브라우저와 웹서버 사이의 통신 규약 역할웹브라우저와 웹서버가 서로 데이터를 주고받을 때, 웹브라우저는 웹서버를 찾아가서 어떤 정보를 요청하고(request), 웹 서버는 그 요청에 따라서 적당한 정보를 응답(response)한다. 요청과 응답? 사실 컴퓨터 사이의 일이기 때문에, 그 사이에 엄격한 규칙이 있다.그 규칙은 문자로 되어 있는 단순한 메세지이기 때문에 복잡하지는 않다. 그 메세지를 확인할 수 있는 도구가 있다. 크롬에서 오른쪽 마우스 버튼을 눌러서 검사를 하면 네트워크 탭을 확인할 수 있는데,이것은 웹브라우저와 웹서버가 서로 데이터를 주고받는 모습을 볼 수 있다. Name에..
웹애플리케이션만들기(글 수정/삭제) 글 수정하기 > 목차에서 글을 선택했을 때, edit 버튼이 나타나면 수정하는 화면으로 가서 수정하는 것을 해보자. view.jade1. edit 버튼 만들기* 여러개의 버튼들을 일렬로 나열하는 모습을 기능들의 목록이란 뜻에서 리스트로 바꿔보겠습니다.Line 25 : 그리고 특정 글을 선택했을 때만 edit 버튼이 나와야 하므로 다음과 같이 설정. app_mysql.jsLine 72 : edit 라우터 확인Line 91-92 : id 값이 없는 경우는 err.Line 83 : edit.jade 화면으로 연결 edit.jadeLine 14 -22 : 글을 가져와서 읽는 부분을 new.jade에서 사용한 폼을 가져와 쓴다.Line 17, 20 : 기존에 작성된 글 가져오기Line 14 : 수정 작업후 'su..
웹애플리케이션 제작 (목차 및 글쓰기) 진짜 현대적인 웹애플리케이션을 만들어보자. 이전 게시글은 이번 포스팅을 위한 부품을 모았던 것이라고 생각해도 좋다.이제 그것들을 결합해서 제대로 만들어보자! 웹애플리케이션이 가지고 있는 전형적인 기능즉, 사용자로부터 어떠한 정보를 입력받아서 그것을 서버에 저장하고 사용자가 필요한 정보를 요청하면 그것을 제공하는 전형적인 웹애플리케이션을 만드는 포스팅이다. 학습을 시작하기에 앞서, 어떤것을 만들지 살펴보자. 1. 링크(목차)를 클릭하면 해당 내용을 보여준다.2. form을 통해 정보를 서버로 전송되면(제출), 그 정보를 받아서 1번 링크에 추가(서버로 부터 정보 받기)하기. 현대적인 웹 애플리케이션들은실제로 사용자가 등록한 정보들을 데이터베이스라고 하는 곳에 저장한다. 여기서는 데이터베이스가 아닌 파일에 ..
윈도우에서 NPM 설치하기 NPM 설치하기 NPM을 사용하기 위해서는 Nodejs가 우선 설치되어있어야 한다.설치가 완료된 후 Nodejs( node -v )와 NPM버전( npm -v )을 확인해보자. (설치한 디렉토리까지 이동 후 확인 가능.) NPM 업데이트 npm install --global --production npm-windows-upgradenpm-windows-upgrade
SQLyog - MySQL 관리툴 설치 및 사용 1. 설치하기 https://github.com/webyog/sqlyog-community/wiki/Downloads설치시에는 한글로 하되, 최종적으로 프로그램을 사용할 때 영어가 불편하지 않다면 영어 사용을 권장합니다. (번역이 애매한 경우가 있더라구요.) 2. 연결하기 NEW 버튼을 통해 연결 이름을 정하고 나면 비활성화 되어 있던 각 항목란이 활성화 됩니다.연결하기 전에 '테스트연결'을 통해 연결이 되는지 확인합니다. 확인이 됐다는 successful! 알림창이 뜨면 저장버튼을 통해 연결정보를 저장해두어야 합니다.저장을 했다면 좌측에 정했던 연결이름을 가진 탭이 생성됩니다. 데이터베이스생성하기좌측에 생긴 탭에서 오른쪽 클릭하면 데이터베이스를 생성할 수 있습니다. ( 윈도우 : Ctrl + D ) 생..
MySQL 소개 및 Nodejs에서의 기본 사용법 MYSQL 소개 - 3대 관계형 데이터베이스 시스템- 성장배경웹이 출현 : 그 웹애플리케이션은 대부분 작은 기업, 개인 등 다양한 사이즈의 주체들이 웹에 참여해서 수많은 웹애플리케이션 나옴.기존에 DB(오라클 등)는 굉장히 부담스러웠을 수 있다. 그런 시대적 분위기에 맞물려서 무료이고 오픈소스이고 성능도 괜찮은 MYSQL이라는 데이터베이스가 그 시대적 요구사항을 반영하게 된 것.그리고 아파치, MYSQL, PHP 삼인방이 같이 묶여서 굉장히 많은 웹애플리케이션이 만들어진다. (=APM)- CompanyMYSQL AB라는 회사에서 만듦.이후 썬이라고 하는 자바를 개발한 회사에게 인수됨.이후 썬이라는 곳이 오라클에게 인수된.MYSQL을 최초로 만든 사람이 오라클의 정책이 맘에 안들어하면서 Maria DB 만..
파일 업로드 파일업로드? 사용자가 선택한 파일을 업로드 하면 그 파일을 웹애플리케이션이 받아서 적당한 디렉토리에 놓는 방법이다.사용자가 애플리케이션에 전달하는 데이터는 크게 글(이전글까지 이 부분을 해결함)과 여러가지 정보가 담긴 파일(이미지 등)라고 할 수 있다. 파일을 선택한 폼에서 파일을 선택 한 후, 제출하면 웹애플리케이션의 특정 디렉토리로 그 파일이 위치하며 사용자에게 업로드한 파일의 이름을 보여주는 것을 만들어보자. 아쉽게도 express는 사용자가 업로드 한 파일을 어딘가에 저장하는 기능을 제공하고 있지 않기 때문에 그 기능을 실행할 수 있는 모듈을 설치해야 한다. 그 모듈은 multer. 이는 express를 이용해서 사용자가 전송한 파일을 어딘가에 전송하는데 잘 튜닝되어 있는 여러 모듈 중에 하나이다..
Express] POST 방식을 이용한 정보의 전달 / nodejs 자동재시작 팁! 서버와 웹 브라우저가 상호작용하는 방법 1. GET 방식2. POST 방식 GET VS POST GET- 웹브라우저에서 웹서버로 어떤 정보를 요청할 때, 이전글까지는 get 방식을 사용했다. 그리고 기본이 GET.- 웹애플리케이션에서 어떠한 정보를 얻어내기 위해서 웹애플리케이션에 주소를 통해 접속하고, 접속한 사용자의 요청에 따른 정보를 응답해준다.- 경우에 따라 쿼리스트링을 통해 어떤 정보를 웹애플리케이션의 요청에 의해서 가져왔다.- 서버에 있는 정보를 가져오는 것 1. form - html에서 form을 보면 url을 생성해주는 작은 프로그램이라고 생각하면 쉽다.- 사용자가 작성해주면, form 태그를 통해서 적당한 URL을 자동으로 생성해서 서버로..

티스토리툴바