간단한 기사 게시 system_node.js를 만드는 nodejs 튜토리얼

머리말

오늘은 간단한 보도자료 시스템을 만들어 보겠습니다. 시스템의 첫 번째 단계는 크게 어렵지 않아도 됩니다.

① 뉴스 유형 관리

② 뉴스 관리(이미지 업로드 기능 포함)

3뉴스 열람

기능은 많지 않지만 기본적인 작업도 많이 다루고 첨부파일 추가, 삭제, 확인, 업로드만 하면 충분합니다. 그럼 오늘부터 공부를 시작하겠습니다

준비

어제의 어려움 끝에 이미 nodeJS 및 mongoDB 환경이 생겼습니다. 이제 새 프로젝트 파일과 데이터베이스 파일을 직접 생성할 수 있습니다

첫 번째 단계는 명령 프롬프트를 열고 D 드라이브로 전환한 후

를 입력하는 것입니다.

코드 복사 코드는 다음과 같습니다.

D:>express -e news

그러면 시스템이 자동으로 기본 환경을 즐겁게 구축해 줍니다

분명히 많은 모듈 종속성이 없습니다. 지금은 어제의 package.json을 테스트해 보세요.

코드 복사 코드는 다음과 같습니다.

{
"name": "응용 프로그램 이름",
"버전": "0.0.1",
"비공개": 사실,
"스크립트": {
"시작": "노드 app.js"
},
"종속성": {
"익스프레스": "3.4.8",
"ejs": "*",
"mongodb": "*"
}
}

그런 다음 프로젝트 디렉토리로 전환하세요:

코드 복사 코드는 다음과 같습니다.

nmp install

모든 종속 파일을 다운로드한 후

를 입력합니다.

코드 복사 코드는 다음과 같습니다.

D:뉴스>노드 앱
포트 3000에서 수신 대기하는 Express 서버

그래서 저희 프로그램은 문제 없이 실행되었습니다.

PS: 여기에 주의가 필요한 문제가 있습니다. 우리가 다운로드한 파일이 UTF-8로 인코딩되지 않아 중국어가 깨질 수 있습니다. 파일 인코딩을 직접 통일해야 합니다.

프로그램 실행시 데이터베이스 관련 설정이 필요합니다

① 먼저 mongoDB 디렉터리에 새 뉴스 폴더를 만듭니다.

② 프로젝트에 settings.js 구성 파일 추가

코드 복사 코드는 다음과 같습니다.

module.exports = {
cookieSecret: 'myNews',
db: '뉴스',
호스트: 'localhost'
};

③ 새 모델 디렉토리를 생성하고 새 db.js를 생성합니다

코드 복사 코드는 다음과 같습니다.

var 설정 = require('../settings'),
Db = require('mongodb').Db,
연결 = require('mongodb').Connection,
서버 = require('mongodb').Server;
module.exports = new Db(settings.db, new Server(settings.host, Connection.DEFAULT_PORT), { safe: true });

④ 데스크탑에 새로운 news.bat 프로그램을 생성하세요

코드 복사 코드는 다음과 같습니다.

d:mongodbbinmongod.exe -dbpath d:mongodbnews

향후 데이터베이스를 시작하려면 실행만 하면 됩니다. 이렇게 하면 기본적으로 사전 준비가 완료됩니다.

근데 두 가지 귀찮은 점이 하나 있는데, 하나는 뉴스 프로그램을 매번 시작하기 귀찮고, 다른 하나는 수정하려면 다시 시작해야 한다는 점인데, 여기서 먼저 이 두 가지 문제를 해결하겠습니다

① 데스크탑에 새로운 news_app.bat를 생성하고 나중에 실행하여 프로그램을 시작합니다

코드 복사 코드는 다음과 같습니다.

node d:newsapp

② Supervisor는 프로그램을 다시 시작하는 데 도움을 주는 프로세스 보호 프로그램입니다. 그런 다음 node_app.bat를 조정하세요.

코드 복사 코드는 다음과 같습니다.

supervisor d:newsapp

물론 먼저 설치해야 합니다.

코드 복사 코드는 다음과 같습니다.

npm install -gsupervisor

이후에는 파일 수정 후 수동으로 재시작할 필요가 없으므로(news_app은 프로젝트 디렉토리에 위치해야 함) 준비작업은 여기서 끝

프로젝트 구조

첫 번째 단계 이후에는 프로젝트 구조에 대해 생각해 봐야 합니다

① 홈페이지는 색인이며 모든 뉴스 유형과 뉴스 항목이 나열됩니다

② 각 뉴스 항목에는 편집/삭제/보기의 세 가지 버튼이 있습니다

③ 홈페이지에 뉴스 추가 버튼이 있습니다. (추가 시 사진 업로드 가능)

기본 기능은 위와 같습니다

그래서 앱에서 라우팅 기능을 제거하고 모든 경로를 색인에 넣었습니다

코드 복사 코드는 다음과 같습니다.

//라우팅 함수를 인덱스에 넣습니다
//app.get('/', Routes.index);
//app.get('/users', user.list);
경로(앱);

코드 복사 코드는 다음과 같습니다.

module.exports = 함수(앱) {
//홈페이지, 이제 홈페이지도
app.get('/', 함수(req, res) {
res.render('index', { title: 'Express' });
});
app.get('/add', function (req, res) {
res.send('뉴스 요청 추가');
});
app.get('/delete', function (req, res) {
res.send('뉴스 요청 삭제');
});
app.get('/view', function (req, res) {
res.send('뉴스 요청 보기');
});
app.get('/update', function (req, res) {
res.send('뉴스 요청 수정');
});
};

첫 번째 단계는 이렇게 간단합니다. 뉴스를 추가하면 별도의 페이지가 있어야 하고 추가 버튼을 클릭하면 다른 처리가 필요하므로 각 요청을 내부적으로 분류해야 하기 때문입니다.

/ 모든 장르와 뉴스가 표시되고 삭제 버튼이 있는 기본 페이지

/add 뉴스 추가 페이지로 이동

/addNews 뉴스별 게시물 요청 주소 추가(버튼 클릭 시 응답)

/delete 뉴스 삭제 요청

/특정 뉴스 검색어 보기

그래서 위의 경로를 약간 수정했습니다.

코드 복사 코드는 다음과 같습니다.

module.exports = 함수(앱) {
//홈페이지, 이제 홈페이지도
app.get('/', 함수(req, res) {
res.render('index', { title: 'Express' });
});
app.get('/add', function (req, res) {
res.send('뉴스 페이지 추가');
});
app.post('/addNews', function (req, res) {
res.send('뉴스 추가 요청 처리 중');
});
app.get('/delete', function (req, res) {
res.send('뉴스 요청 삭제');
});
app.get('/view', function (req, res) {
res.send('뉴스 요청 보기');
});
};

따라서 웹 페이지를 구성하기 위해 몇 가지 새로운 템플릿을 만들어야 합니다. 여기서는 머리와 꼬리를 분리하지 않고 가장 간단한 페이지만 만듭니다.

임시로 index.ejs와 동일하게 작동하는 두 개의 템플릿 파일 add 및 view를 추가하고 탐색을 수정했습니다.

코드 복사 코드는 다음과 같습니다.

module.exports = 함수(앱) {
//홈페이지, 이제 홈페이지도
app.get('/', 함수(req, res) {
res.render('index', { title: 'Express' });
});
app.get('/add', function (req, res) {
res.render('add', { title: '뉴스 페이지 추가' });
});
app.post('/addNews', function (req, res) {
res.send('뉴스 추가 요청 처리 중');
});
app.get('/delete', function (req, res) {
res.send('뉴스 요청 삭제');
});
app.get('/view', function (req, res) {
res.render('view', { title: '뉴스 요청 보기' });
});
};

프로젝트 구조는 여기까지입니다

데이터 운영

전체 구조가 나온 후 데이터 작업을 수행해야 합니다.

① 데이터 추가(뉴스 추가)

② 데이터 표시 (뉴스 표시)

③ 데이터 삭제(뉴스 삭제)

원래는 형 연산도 포함되어 있는데 하다가는 알 수가 없어서 처음 해보면 헷갈리기 쉽기 때문에 일단 놔두겠습니다

뉴스 추가

여기서 양식 제출을 사용하지 않고 ajax를 사용합니다... 여기에서는 zepto 라이브러리를 소개하므로 페이지가 이렇게 됩니다

코드 복사 코드는 다음과 같습니다.

>

>

제목:

콘텐츠:

          

핫 AI 도구

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

더보기

인기 기사

R.E.P.O. 에너지 결정과 그들이하는 일 (노란색 크리스탈)

2 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌

스플릿 소설을이기는 데 얼마나 걸립니까?

1 몇 달 전 By DDD

R.E.P.O. 최고의 그래픽 설정

2 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌

어 ass 신 크리드 그림자 : 조개 수수께끼 솔루션

1 몇 주 전 By DDD

R.E.P.O. 아무도들을 수없는 경우 오디오를 수정하는 방법

2 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌

더보기

뜨거운 도구

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

더보기

뜨거운 주제

Gmail 이메일의 로그인 입구는 어디에 있나요?

7403

15

자바 튜토리얼

1630

14

Cakephp 튜토리얼

1358

52

라라벨 튜토리얼

1268

25

PHP 튜토리얼

1218

29

더보기

Related knowledge

nodejs와 tomcat의 차이점 Apr 21, 2024 am 04:16 AM

Node.js와 Tomcat의 주요 차이점은 다음과 같습니다. 런타임: Node.js는 JavaScript 런타임을 기반으로 하는 반면 Tomcat은 Java Servlet 컨테이너입니다. I/O 모델: Node.js는 비동기식 비차단 모델을 사용하는 반면 Tomcat은 동기식 차단 모델을 사용합니다. 동시성 처리: Node.js는 이벤트 루프를 통해 동시성을 처리하는 반면 Tomcat은 스레드 풀을 사용합니다. 애플리케이션 시나리오: Node.js는 실시간, 데이터 집약적, 동시성 애플리케이션에 적합하고 Tomcat은 기존 Java 웹 애플리케이션에 적합합니다.

nodejs와 vuejs의 차이점 Apr 21, 2024 am 04:17 AM

Node.js는 서버측 JavaScript 런타임인 반면, Vue.js는 대화형 사용자 인터페이스를 생성하기 위한 클라이언트측 JavaScript 프레임워크입니다. Node.js는 백엔드 서비스 API 개발, 데이터 처리 등 서버 측 개발에 사용되고, Vue.js는 단일 페이지 애플리케이션, 반응형 사용자 인터페이스 등 클라이언트 측 개발에 사용됩니다.

nodejs는 백엔드 프레임워크인가요? Apr 21, 2024 am 05:09 AM

Node.js는 고성능, 확장성, 크로스 플랫폼 지원, 풍부한 생태계, 개발 용이성 등의 기능을 제공하므로 백엔드 프레임워크로 사용할 수 있습니다.

nodejs를 mysql 데이터베이스에 연결하는 방법 Apr 21, 2024 am 06:13 AM

MySQL 데이터베이스에 연결하려면 다음 단계를 따라야 합니다. mysql2 드라이버를 설치합니다. mysql2.createConnection()을 사용하여 호스트 주소, 포트, 사용자 이름, 비밀번호 및 데이터베이스 이름이 포함된 연결 개체를 만듭니다. 쿼리를 수행하려면 Connection.query()를 사용하세요. 마지막으로 Connection.end()를 사용하여 연결을 종료합니다.

nodejs 설치 디렉토리에 있는 npm과 npm.cmd 파일의 차이점은 무엇입니까? Apr 21, 2024 am 05:18 AM

Node.js 설치 디렉터리에는 npm과 npm.cmd라는 두 가지 npm 관련 파일이 있습니다. 차이점은 다음과 같습니다. 확장자가 다릅니다. npm은 실행 파일이고 npm.cmd는 명령 창 바로 가기입니다. Windows 사용자: npm.cmd는 명령 프롬프트에서 사용할 수 있으며, npm은 명령줄에서만 실행할 수 있습니다. 호환성: npm.cmd는 Windows 시스템에만 해당되며 npm은 크로스 플랫폼에서 사용할 수 있습니다. 사용 권장사항: Windows 사용자는 npm.cmd를 사용하고, 기타 운영 체제는 npm을 사용합니다.

nodejs는 백엔드 개발 언어인가요? Apr 21, 2024 am 05:09 AM

예, Node.js는 백엔드 개발 언어입니다. 서버 측 비즈니스 로직 처리, 데이터베이스 연결 관리, API 제공 등 백엔드 개발에 사용됩니다.

nodejs의 전역 변수는 무엇입니까 Apr 21, 2024 am 04:54 AM

Node.js에는 다음과 같은 전역 변수가 존재합니다. 전역 개체: 전역 핵심 모듈: 프로세스, 콘솔, 필수 런타임 환경 변수: __dirname, __filename, __line, __column 상수: undefine, null, NaN, Infinity, -Infinity

nodejs와 java 사이에 큰 차이가 있나요? Apr 21, 2024 am 06:12 AM

Node.js와 Java의 주요 차이점은 디자인과 기능입니다. 이벤트 중심 대 스레드 중심: Node.js는 이벤트 중심이고 Java는 스레드 중심입니다. 단일 스레드 대 다중 스레드: Node.js는 단일 스레드 이벤트 루프를 사용하고 Java는 다중 스레드 아키텍처를 사용합니다. 런타임 환경: Node.js는 V8 JavaScript 엔진에서 실행되는 반면 Java는 JVM에서 실행됩니다. 구문: Node.js는 JavaScript 구문을 사용하고 Java는 Java 구문을 사용합니다. 목적: Node.js는 I/O 집약적인 작업에 적합한 반면, Java는 대규모 엔터프라이즈 애플리케이션에 적합합니다.

See all articles