Skip to content

ledvanoff/fullstack-nolibs-project

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Fullstack-проект для обучения студентов. Backend на чистом Python, Frontend на чистом JS. Использована только CSS-библиотека Pure CSS.
Проект создан с целью познакомить студентов с взаимодействием Backend и Frontend, показать как можно писать небольшие проекты "на функциях", без архитектуры на ООП.
Также проект показывает, как работает HTTP-сервер и роутинг на "низком уровне".

!!!Текст задания в файле "ТЗ.odt" репозитория
==============================================================================

МИНИМАЛЬНЫЕ ТРЕБОВАНИЯ:
Python 3.5+
Современный браузер с поддержкой синтакиса ES7

ЗАПУСК ПРИЛОЖЕНИЯ:
python run.py

СОСТАВ ПРИЛОЖЕНИЯ:
--Директории:
  static/css - директория стилей .css
  static/js - директория подключаемых к html-шаблонам JS-скриптов
  static/libs - директория подключаемых библиотек
  templates/ - директория с html-шаблонами
--Основные файлы:
  run.py - файл запуска приложения
  router.py - файл с функциями для обработки и роутинга http-запросов
  models.py - функции для работы с БД
  database.db - файл БД
  script.sql - sql-скрипт для заполнения стартовых значений в БД
ПРИНЯТЫЕ УПРОЩЕНИЯ:
  1.  Общение с фронт-енд просходит по MIME-type text, который затем в определенных случаях преобразуется в JSON. Для       файлов стилей и js также MIME-type text.
  2.  Не выполнена валидация формы на сервере.
  3.  При ошибках сервера, ошибка генерируется в body-ответа (в ключ словаря 'err' или 'warn'), при этом в заголовке http-ответа код может быть 200 - OK.
  4.  Местами нарушен принцип DRY, принцип единой ответственности функций
  5.  Рендеринг html-таблиц с большим кол-вом данных происходит на frontend. 

ОПИСАНИЕ:
Приложение написано согласно ТЗ, архитектура построена на манер "суперупрощенного" Flask (по сути MVC-модель). В Python и JS не использовано ни одной сторонней библиотеки. С учетом того, что в коде Python использовались конструкции типа f-string, необходим Python3.5+. В JS-коде присутствует синтаксис ES7 (async/await, Object.entries() и др.)
--Логика run.py:
  Серверная часть построена на базе встроенной библиотеки socket - при запуске приложения по умолчанию поднимается соккет   http://localhost:5000/ который в бесконечном цикле "слушает" http-запросы и генерирует ответы в зависимости от http-  метода и url запроса. 
--Логика router.py:
  За роутинг отвечает логика в файле router.py, где запрос на сервер-соккет разбирается на http-метод, url, body в   соответствии со словарем URLS происходит генерация ответа сервера, в зависимости от адреса обращения. Если адреса нет в   списке, будет сгенерирована ошибка 404 - Not found. Если http-метод не соответствует разрешенному, будет сгенерирована   ошибка сервера 405 - Method not allowed. По отдельному url /stat, происходит обработка файлов из дирректории stat/
--Логика models.py:
  В models.py собраны функции для запросов к БД SQLite. Основная функция-executor - execute_db_query, принимающая функции-запросы (эдакий полу-декоратор). Примечательным является использование dict-factory, которая позволят получать ответы от БД в виде словаря, что значительно упрощает работу.
--FRONTEND -> BACKEND
  Общение frontend -> backend   построено посредством асинхронного метода fetch().
--Стилизация
  Основной файл стилей satic/css/style.css . Также для "пригодного вида" использована css-only библиотека Pure.css
--Templates и top-menu
  На манер Flask-а с помощью функции render() происходит рендеринг html-шаблонов. Top-меню рендерится js-файлом renderMenu.js

=====Функционал относительно URL=====
-- /, /index
Главная страница приложения, навигация по топ-меню
-- /comment
Здесь расположена форма добавления комментариев, валидация полей выполнена посресдством HTML-5 (input[type],pattern,required и т.д.), дополнительно выполнена валидация на JS, в случае, если не поддерживается HTML валидация. На сервере валидация не производилась (см. ПРИНЯТЫЕ УПРОЩЕНИЯ)
-- /view
   Здесь выводятся комментарии с функцией удаления. Рендеринг таблицы происходит на frontend.
-- /stat
  Здесь выводится статистика по регионам согласно ТЗ. При клике на ссылку, срабатывает "аккордеон", появляется статистика по городам.

ЧТО МОЖНО УЛУЧШИТЬ:

1. Использовать ООП
2. Использовать python-декораторы ля работы с функциями БД и роутинга
3. Производить рендеринг html на сервере.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • CSS 86.6%
  • JavaScript 5.6%
  • Python 5.3%
  • HTML 2.5%