본문 바로가기

Others

 (103)
Cookie (쿠키) 쇼핑카트애플리케이션 만들기 (width nodeJs) Shopping cart 사용자가 구매하고자 하는 아이템을 장바구니에 담는 기능 쿠키를 제어해서, 쿠키를 만들고,변경,삭제 하여 만들어지는 기능. 라우팅 처리 /products 구현 ~/products : 제품 목록이 나오고, ~/cart 카트버튼을 누르면 장바구니에 담은 목록이 삭제 버튼과 함께 존재. 제품이름을 누를때마다 카트에 클릭한 갯수만큼 카운트가 될 것이다. 그 형태는 다음과 같다. Line 15 : products[name].title 로 console.log를 찍어보면 'The history of web 1' 'The next web' 을 확인할 수 있다. Line 14 : output 변수 - 화면에 그려낼 요소를 담는 변수를 만들었다. Line 15-19 : 화면에 이 객체가 가지고 있..
웹애플리케이션만들기(글 수정/삭제) 글 수정하기 > 목차에서 글을 선택했을 때, 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번 링크에 추가(서버로 부터 정보 받기)하기. 현대적인 웹 애플리케이션들은실제로 사용자가 등록한 정보들을 데이터베이스라고 하는 곳에 저장한다. 여기서는 데이터베이스가 아닌 파일에 ..
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을 자동으로 생성해서 서버로..
Express] URL을 이용한 정보의 전달 (GET) 쿼리스트링이란? 1. 애플리케이션으로 들어오는 입력(IN)에 의해 다른 출력(OUT)을 하는 매커니즘을 좀 더 정교하게 다루는 법 언제나 똑같이 작동하는 애플리케이션도 애플리케이션이지만, 애플리케이션이 어떠한 사용자의 입력(조작)이 있을 때 그 조작에 의해서 적당한 다른 결과를 보여주는 것이 기능성이 좋은, 의미 있는 애플리케이션이라고 할 수 있다. 2. 물음표 뒤에 나타내는 정보 보통 애플리케이션은 사용자의 어떠한 입력의 영향을 받고 있을까요? 주소!http://a.com/login 에 따라 다른 결과를 사용자에게 보여주고 있다.사용자가 a.com/login으로 들어오면 login에 해당되는 라우터가 그 라우터와 연결되어 있는 익명함수(콘트롤러)를 호출해서 적당한 결과를 보여주었다. http://a.c..

티스토리툴바