본문 바로가기
728x90

Web Development

 (38)
[EJS] ejs 사용 튜토리얼 ejs란? ejs는 Embedded JavaScript의 약자로, 자바스크립트가 내장되어 있는 html 파일을 의미한다 html 파일과의 차이점은 html 안에 내장되어 있는 것과 바깥에서 건드리는 것의 차이이다. 즉, ejs는 html의 태그처럼 자바스크립트 내용을 삽입할 수 있다. 일반 html 파일은 무조건 태그를 이용해 분리를 시켜야하지만, ejs는 지정된 태그를 통해 스크립트 내용을 하나의 요소처럼 사용될 수 있게 한다. 또한 서버에서 보낸 변수를 가져와 사용할 수 있다 ejs에는 자바스크립트를 내장 시킬 수 있는 2가지의 태그가 있다. 태그 안에는 무조건 자바스크립트 코드가 들어가야한다. 그리고 줄바꿈을 하면 새로운 를 이용해야 한다. 안방으로 들어왔습니다. or 태그 두 가지 표기법이 있지만..
Node.js/Express 튜토리얼 1. node.js 설치 설치 후, 터미널에서 아래 명령어를 입력해 node.js와 npm의 설치 버전 확인 * npm(node package manager)은 node.js 내부의 패키지 관리자로, node.js 설치 시 자동으로 같이 다운됨 node -v npm -v 2. js 파일 실행 방법 node node test.js 3. 오픈소스 모듈 설치방법 npm install * 패키지 다운 전에 npmjs.com에서 패키지의 안정성을 검토하고 적용 npm install nodemailer * 설치되는 모듈은 node_modules 폴더에 들어오게 됨 * package-lock.json 파일에는 설치된 모듈 정보가 json 파일 형식으로 정리되어 있음 4. 설치한 모듈 불러오기 require('') c..
[Node.js] Node.js란? (Node.js는 백엔드인가?) Node.js는 백엔드인가? node.js는 백엔드라기보다 자바스크립트 런타임이란게 정확한 표현입니다. 즉 그 런타임 속에 서버 기능이 들어가 있는 거죠. Node.js는 run-time environment이다. 쉽게 말해서, Node.js는 JavaScript 코드를 브라우저 밖에서 실행시키기 위한 프로그램이다. Node.js 사용이유 JavaScript는 독립적인 언어가 아닌 스크립트 언어로서, 스크립트 언어는 특정한 프로그램 안에서 동작하는 언어를 의미하며, 즉, JavaScript는 웹 브라우저(크롬, 사파리, 익스플로러, 파이어폭스 등)가 없으면 사용할 수 없는 언어이다. 이때. Node.js는 JavaScript 를 웹 브라우저에서 독립시킨 것으로 Node.js를 설치하게 되면 터미널프로그램..
'index를 탄다'의 의미 Index란? 인덱스란 지정한 컬럼들 기준으로 일종의 목차를 생성하는 것으로서, 데이터 검색 속도 향상을 위해 사용되는 기술이다. 인덱스를 사용하면 좋은 경우 1.테이블 행의 갯수가 많은 경우 2.인덱스를 적용한 컬럼이 where절에서 많이 사용되는 경우 3.검색 결과가 원본 테이블 데이터에 비해 적을 경우(2-4%) 4.해당 컬럼이 null을 포함하는 경우 인덱스 사용하면 좋지 않은 경우 1.테이블의 행의 갯수가 적음 2.검색결과가 원본테이블 데이터의 많은 비중 3.원본 테이블의 insert, delete update가 빈번(성능이 떨어진다. 인덱스를 재성생해야하기 때문) 'Index를 탄다'의 의미 학창시절 생활기록부 파일철이 있다고 했을때 맨 앞장에 간략히 목차란게 있으면 찾기 훨씬 수월할 것이다...
RESTful이란? REST란? REST는 Representational State Transfer라는 용어의 약자로서 웹의 장점을 최대한 활용할 수 있는 아키텍처 네트워크 상에서 Client와 Server 사이의 통신 방식 중 하나 웹 사이트의 이미지, 텍스트, DB 내용 등의 모든 자원에 고유한 ID인 HTTP URI(Uniform Resource Identifier)를 부여하고, HTTP Method(POST, GET, PUT, DELETE)를 통해 해당 자원에 대한 CRUD Operation을 적용하도록 설계된 아키텍쳐 http의 url과 http method(GET, POST, PUT, DELETE)를 사용해서 API 가독성을 높인 구조화된 시스템 아키텍쳐이며, 하나의 URL로 최소 4가지의 HTTP method를..
[Django/JS] Jquery Ajax를 JS Fetch 함수로 변환하는 방법 fetch_option = { method: "POST", headers: { "Content-Type" : "application/json", }, body : JSON.stringify(data), }; fetch("url/", fetch_option).then(response => {return response.json()}) .then(response => { // function to execute }) .catch(function(err){ alert(err) }) .finally(function(){ }) error -> catch complete -> finally // views.py def AnyFunction(request): data = json.load(request) return..
[Django] CSS,JS 파일 캐쉬 해제하는 방법 웹 배포 시마다 CSS, JS 파일이 바로 적용되지 않는다면, 이전 CSS,JS 파일의 캐쉬가 존재하기 때문이다. 이를 해제하기 위해서는 다음과 같이 ?{% now 'U' %} 를 붙여준다. * static을 사용하지 않는 경우에도 동일하게 href나 src 뒤에 붙여준다 ?version=1 과 같이 일일이 버전을 수동적으로 관리하는 방법도 있지만, ?{% now 'U' %} 를 사용할 경우, 파일 로드 파라미터로 매 초마다 Unix Timestamp를 자동적으로 생성한다 따라서, 위와 같이 파일 로드 태그를 붙여주면, 실제 웹 사이트 상에서는 아래와 같이 자체적으로 생성한 파라미터(1249948982)를 사용해 파일을 찾게 된다 Reference django css file cached I'm havi..
[Django] Rest framework 개념 및 사용법(django-rest-framework) RESTful이란? RESTful이란, Representational State Transfer의 줄임말로서, http의 url과 http method(GET, POST, PUT, DELETE)를 사용해서 API 가독성을 높인 구조화된 시스템 아키텍쳐이며, 하나의 URL로 최소 4가지의 HTTP method를 전송할 수 있다는 장점이 있다. 기존에는 웹 페이지를 보여주는 웹서버만 구현하여 웹 서버에서 DB서버의 데이터도 읽어오고, 사용자들이 글을 남기면 DB 서버에 저장까지 하는 기능을 모두 담당했다. 하지만 스마트폰이 출시되고, 어플리케이션의 등장으로 더이상 웹으로만 서비스를 제공하는 것에 한계가 있었다. 스마트폰 어플과 웹에서 동일한 기능을 제공하는데 기존의 웹서버를 계속 사용하면 매번 HTML을 읽..
반응형

티스토리툴바