FastAPI小项目实战:电影列表(Vue3 + FastAPI)
假期过半, FastAPI + Vue3项目实战 视频也算录完了,尽管项目简单(2张表 共7个接口 4个页面)
起因
- 在6月底的时候开始录制了FastAPI官方文档中的新手教程部分(实际还没有官网文档详细),过程中缺少了和数据库交互
- 在第一次发了FastAPI 翻抄的其他Web项目之后,有同行问到如何和Vue结合使用
结果
在假期结束前,完成了该项目
项目介绍
该项目参考(严重抄袭)Hello Flask 一书中的实战项目: Flask 入门教程 - HelloFlask
该项目使用以下开源项目完成
- [x] FastAPI
- [x] Tortoise ORM
- [x] Vue3
- [x] Vuex
- [x] VueRouter
- [x] Axios
- [x] ElementPlus
- [x] Vite2
该项目采用Docker部署:
服务器比较拉, 还请温柔些
该项目效果图如下
该项目整体是简单的 只有 两张表,且没有关系。
源码及资料
Gitee: https://gitee.com/zy7y/watch-fastapi
Github: https://github.com/zy7y/watch-fastapi
B站实录视频:https://space.bilibili.com/438858333/channel/detail?cid=190225&ctype=0
对你有帮助还请Star/三连
致谢
感谢以上所有用到的技术栈、框架的作者及其团队
感谢CoderWhy老师的视频教程
- [x] Vue2
感谢李辉老师的Hello Flask书籍及该项目的原版
- [x] Hello Flask
- [x] watchlist
FastAPI小项目实战:电影列表(Vue3 + FastAPI)的更多相关文章
- 图解微信小程序---获取电影列表
图解微信小程序---获取电影列表 代码笔记 list跳转 第一步:编写前端页面获取相关的电影列表参数(对于显示参数不熟悉,可以先写js,通过console Log的方式获取我们电影的相关数据字段,后 ...
- 微信小程序实战,用vue3实现每日浪漫情话推荐~
之前做了个恋爱话术微信小程序,实现高情商的恋爱聊天. 但最近突然发现,每天早上给女朋友发一段优美情话可以让她开心一整天,但无奈自己的语言水平确实有限,不能随手拈来,着实让人有点不爽. 不过办法总比困难 ...
- Linux+eclipse+maven+tomcat7小项目实战
一.准备工作:CentOS6.5安装linux,maven,tomcat7,eclipse 二.在linux中打开eclipse,创建一个maven项目 修改web.xml 打开Navigator视图 ...
- 【计算机视觉】OpenCV篇(4) - Pycharm+PyQt5+Python小项目实战
1.下载安装 (1)Pycharm:下载链接 (2)推荐使用Qt Designer来设计界面,如果你装的是Anaconda的话,就已经自带了designer.exe,我这里使用的是Pycharm的虚拟 ...
- python爬虫小项目实战
- vue_小项目_模糊搜索(列表过滤)_结果排序
html <div id="test"> <label> <input type="text" v-model="sea ...
- 实战小项目BUG纪录
果然,作为程序员最可爱的女朋友就是各种BUG,解决了你的开发能力和开发效率就会上升到一个新的层次.反之,在你面对BUG的时候,如果轻易的就放弃了,你也就失去了一次自我成长的机会.学习就是这样的,我们有 ...
- 微信小程序实战--集阅读与电影于一体的小程序项目(一)
1.首页欢迎界面 项目目录结构 新建项目ReaderMovie,然后新建文件,结构如下 welcome.wxml <view class='container'> <image cl ...
- 微信小程序入门与实战 常用组件API开发技巧项目实战*全
第1章 什么是微信小程序? 第2章 小程序环境搭建与开发工具介绍 第3章 从一个简单的“欢迎“页面开始小程序之旅 第4章 第二个页面:新闻阅读列表 第5章 小程序的模板化与模块化 第6章 构建新闻详情 ...
随机推荐
- JSONObject和JSONArray的使用
1.Json里面的数据是以一种键值对的方式存在("key","value"),其语法多是{},[]的单独形式或者组合形式. 2.对于JsonObject: a. ...
- SpringCloud商品服务调用方式之feign
简介:改造电商项目 order-service服务 调用商品服务获取商品信息 Feign: 伪RPC客户端(本质还是用http) 官方文档: https://cloud.spring.io/sprin ...
- ABC类IP地址
A类IP地址一个A类IP地址由1字节的网络地址和3字节主机地址组成,网络地址的最高位 必须是"0", 地址范围从1.0.0.0 到126.0.0.0.可用的A类网络有126个,每个 ...
- react的每个方法为什么一定要bind this
一开始学习react的时候就了解了react的每个方法都要bind(this)或者使用箭头函数绑定this的指向,到底是为什么要这么写呢,当时要学习的东西太多了就没在意,今天特别好奇(不搞懂不吃饭的态 ...
- java基础之ThreadLocal
早在JDK 1.2的版本中就提供java.lang.ThreadLocal,ThreadLocal为解决多线程程序的并发问题提供了一种新的思路.使用这个工具类可以很简洁地编写出优美的多线程程序.Thr ...
- Redis的持久化机制与内存管理机制
1.概述 Redis的持久化机制有两种:RDB 和 AOF ,这两种机制有什么区别?正式环境应该采用哪种机制? 我们的服务器内存资源是有限的,如果内存被Redis的缓存占满了怎么办?这就要看Redis ...
- Python - 面向对象编程 - __del__() 析构方法
del 语句 Python 提供了 del 语句用于删除不再使用的变量 语法 del 表达式 删除变量的栗子 var = "hello" del var print(var) # ...
- Linux proc文件系统小记
序言: 当linux系统存在多个网口时(也可以是一个网口配置两个IP),每个网口配置不同的IP地址,并且分别连接到不同的电脑上,电脑分别配置与相连的网口统一网段的IP且将电脑网关设置为linux的网口 ...
- Nginx:多项目开发配置跨域代理
简述Nginx应用场景(前后端) 当我们开发 vue 项目中可以通过 proxyTable 进行跨域,但如果是原生的 html+css+js ,或者其他没有跨域插件的项目中,想要跨域就要引入配置许多的 ...
- 富文本编辑器-SpringBoot
目录 简介 Editor.md 基础工程搭建 数据库设计 基础项目搭建 文章编辑整合(重点) 图片上传问题 表情包问题 文章展示 简介 项目地址:https://gitee.com/zwtgit/ri ...