NodeJS. Как создать "список дел". Часть 3.
Всем привет! В этой статье мы продолжим писать наше приложение и создадим отображение для GET-запроса на NodeJS.
В этой статье мы сфокусируемся на GET-запросе в нашем контроллере todoController.js и создадим для него отображение.
Давайте создадим в корне нашего проекта папку views, а в ней – файл todo.ejs.
<html>
<head>
<title>Todo List</title>
<script src="http://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="/assets/styles.css">
</head>
<body>
<h1>Список дел</h1>
<div id="todo-table">
<form>
<input type="text" name="item" placeholder="Добавьте новый пункт" required>
<button type="submit">Добавить пункт</button>
</form>
<ul>
<li>Пункт 1</li>
<li>Пункт 2</li>
<li>Пункт 3</li>
</ul>
</div>
</body>
</html>
Вот такая форма у нас будет, где мы сможем добавлять новые пункты. Пока что пункты записаны вручную, но потом мы сделаем, чтобы они добавлялись из базы данных.
Перейдем в наш контроллер todoController.js и добавим там отрисовку этого шаблона:
app.get('/todo', function(req, res) {
res.render('todo');
});
Если вы теперь запустите сервер и перейдете по ссылке http://localhost:3000/todo, то увидите наш шаблон со всеми стилями, который был отрисован нашим контроллером todoController.js.
Итак, а на этом сегодня все. Спасибо за внимание!
-
Создано 21.06.2017 11:15:27
-
Михаил Русаков
Комментарии (0):
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.