๐ ๊ณต๋ถํ๋ ์ง์ง์ํ์นด๋ ์ฒ์์ด์ง?
[Login & Register authentication with Node js] (3) ๋ก๊ทธ์ธ & ํ์๊ฐ์ ํ์ด์ง ์์๊ฒ ๋ณ๊ฒฝํ๊ธฐ ๋ณธ๋ฌธ
๐ฉ๐ป ๋ฐฑ์๋(Back-End)/Node js
[Login & Register authentication with Node js] (3) ๋ก๊ทธ์ธ & ํ์๊ฐ์ ํ์ด์ง ์์๊ฒ ๋ณ๊ฒฝํ๊ธฐ
์ง์ง์ํ์นด 2023. 3. 15. 00:57728x90
๋ฐ์ํ
<๋ณธ ๋ธ๋ก๊ทธ๋ Traversy Media ์ ์ ํ๋ธ๋ฅผ ์ฐธ๊ณ ํด์ ๊ณต๋ถํ๋ฉฐ ์์ฑํ์์ต๋๋ค :-)>
=> Node.js With Passport Authentication | Full Project
=> authentication app with login, register and access control using Node.js, Express, Passport, Mongoose
๋ฐ๋ผํ๋ค๊ฐ bootstrap ์ ์ ์ฉ๋ผ์ ์ ๋ถ์ ๊นํ๋ธ ์ฐธ๊ณ ํจ..
๐ฅ ๋ก๊ทธ์ธ & ํ์๊ฐ์ ํ์ด์ง ์์๊ฒ ๋ณ๊ฒฝํ๊ธฐ
const express = require("express");
const expressLayouts = require("express-ejs-layouts");
const app = express();
// ejs ๋ฏธ๋ค์จ์ด
app.use(expressLayouts);
// express ์ view ์์ง์ ejs ๋ก ์ธํ
app.set("view engine", "ejs");
// img
app.use(express.static('public'));
// Routes
app.use("/", require("./routes/index"));
app.use("/users", require("./routes/user"));
const PORT = process.env.PORT || 8000;
app.listen(PORT, console.log(`๐Server started on port http://localhost:${PORT}`));
๐ง views/layout.ejs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<link rel="stylesheet" href="https://bootswatch.com/4/journal/bootstrap.min.css" />
<title>Node.js ๋ก ๋ก๊ทธ์ธ ๋ฐ ํ์๊ฐ์
</title>
</head>
<body>
<div class="container">
<%- body %>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"
integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"
integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k"
crossorigin="anonymous"></script>
</body>
</html>
๐ง views/welcome.ejs
<div class="row mt-5">
<div class="col-md-6 m-auto">
<div class="card card-body text-center">
<!-- app.js ์์ express.static ๋ฏธ๋ค์จ์ด ํจ์์ ์ ๋ฌํ๋ฉด ํ์ผ์ ์ง์ ์ ์ธ ์ ๊ณต์ ์์ -->
<center><img src="/images/alpaca.jpg" width="100px" height="100px"></center>
<p style="margin-top: 16px;">๋ก๊ทธ์ธ & ํ์๊ฐ์
</p>
<a href="/users/register" class="btn btn-primary btn-block mb-2">Register</a>
<a href="/users/login" class="btn btn-secondary btn-block">Login</a>
</div>
</div>
</div>728x90
๋ฐ์ํ
'๐ฉโ๐ป ๋ฐฑ์๋(Back-End) > Node js' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
'๐ฉ๐ป ๋ฐฑ์๋(Back-End)/Node js' Related Articles
more
Comments