Django+Vue开发生鲜电商平台之2.开发环境搭建

本文涉及的产品
云数据库 RDS MySQL Serverless,0.5-2RCU 50GB
简介: 文章目录一、PyCharm的安装和简单使用二、MySQL和Navicat的安装和使用三、Python的安装四、虚拟环境的安装和配置五、Vue开发环境搭建

一、PyCharm的安装和简单使用

由于开发的主要后端语言是Python,因此选择PyCharm作为主要的开发工具。

PyCharm可以直接在搜索引擎中直接搜索官网下载,在每种平台均有社区版专业版两种。社区版免费但功能有限,适合初学者;专业版功能齐全,适合专业开发者。开发者可以根据需要自行选择。

Windows下安装PyCharm与安装普通软件类似。在安装好之后,即可进行个性化的设置,如快捷键设置、编译器选择、虚拟环境创建等等。

二、MySQL和Navicat的安装和使用

由于项目使用的数据库是MySQL,因此MySQL数据库及其可视化工具的安装是很必要的。安装MySQL可以直接在MySQL官网下载安装文件进行安装,也可以使用集成工具安装,如PhpStudy等等,这里我选择的是通过PhpStudy来安装,简化安装步骤、操作也更方便,可以在光网下载,也可以直接点击https://download.csdn.net/download/CUFEECR/12340408进行下载、解压、安装。

为了在方便在命令行中操作MySQL,需要将MySQL的安装目录添加到环境变量,路径一般是XXX\PhpStudy\phpstudy_pro\Extensions\MySQL5.7.26\bin。

MySQL的可视化管理工具有很多,比如Navicat和SQLYog等,这里选择Navicat,它是轻便的数据库管理工具,其简单使用演示如下:

显然,Navicat可以方便地建数据库、建表、插入数据、执行查询操作,还有其他很实用的功能。

注意:

在连接数据库前,必须要在PhpStudy中启动MySQL服务。

三、Python的安装

Python2和Python3均可以在官网直接下载安装即可,安装后需要把安装路径配置到环境变量,以便在命令行中执行Python命令。

由于官网下载较慢,因此给大家提供了更快的下载方式,点击https://download.csdn.net/download/CUFEECR/12633636即可下载Python3.8。

如果Python2和Python3同时存在,要注意版本管理,其实现在Python2已经停止更新,并且Python3已经基本上可以涵盖Python2的功能,所以只安装Python3也足够。

说明:

因为Python最新版一般功能正在逐步完善,所以不太稳定、并且支持的库也未完全同步,因此建议不要安装当前最新版本的Python,可以选择稍低一点的版本。

四、虚拟环境的安装和配置

虚拟环境可以将不同项目的开发环境相互隔离,不至于相互影响,以满足不同项目对环境依赖的不同要求

Python有很多虚拟环境库,如pipenv和virtualenv等,这里选择virtualenv,使用命令pip install virtualenv即可安装虚拟环境库。

使用命令virtualenv envname即可创建虚拟环境,然后进入到虚拟环境目录下的Scripts目录,并执行activate.bat命令即可进入虚拟环境,进入虚拟环境后看到命令行目录前面有括号括起来的虚拟环境名称,即说明进入虚拟环境成功。

如果要退出虚拟环境直接执行deactivate.bat命令即可。

如果有多个Python版本,可以指定Python版本安装虚拟环境,命令为virtualenv -p xxx\python.exe envname,-p的参数为指定版本的Python可执行文件的路径。

但是可以看到,每次执行进入和退出虚拟环境的命令时,都需要切换到虚拟环境的安装目录,显得很麻烦,此时需要用到虚拟环境管理包,即virtualenvwrapper,也需要通过命令pip install virtualenvwrapper(Python2)或pip install virtualenvwrapper-win(Python3)安装。

此时再执行mkvirtualenv envname即可创建并进入虚拟环境,默认是创建到系统盘当前目录下,如果需要将虚拟环境保存到其他目录,可以在环境变量中添加系统变量,变量名为WORKON_HOME,值为虚拟环境的目标路径。

如果有多个Python版本时需要指定建立某个Python版本的虚拟环境,需要指定--python参数,参数值为Python可以执行文件的路径。

退出虚拟环境用deactivate命令,再次进入执行workon envname即可。

进入到虚拟环境之后,我们就可以像在系统环境中安装库一样安装所需要的库。

五、Vue开发环境搭建

IDE可以使用WebStorm、VSCode、Sublime等,可以根据自己的需要继续选择。

Vue开发需要使用到npm,所以需要安装node.js,可以在http://nodejs.cn/download/选择合适的系统和版本下载安装即可,安装之后,新开一个命令行,执行node --version,如果打印出所安装的Node.js的版本号,即说明安装成功。

此时需要安装cnpm,这是npm的淘宝镜像,在下载依赖包时的速度比npm更快,直接执行命令npm install -g cnpm --registry=https://registry.npm.taobao.org并等待执行结束即可,此时再执行cnpm --version,打印出以下信息即说明安装成功:

cnpm@6.1.1 (XXX\npm\node_modules\cnpm\lib\parse_argv.js)
npm@6.14.6 (XXX\npm\node_modules\cnpm\node_modules\npm\lib\npm.js)
node@14.5.0 (E:\nodejs\node.exe)
npminstall@3.27.0 (XXX\npm\node_modules\cnpm\node_modules\npminstall\lib\index.js)
prefix=XXX\npm
win32 x64 10.0.18363
registry=https://r.npm.taobao.org

以后就可以直接使用cnpm而不用再使用npm了,安装一个项目所需要的包在项目主目录下执行cnpm install命令,启动项目执行cnpm run dev命令,启动后就可以访问项目了。

相关实践学习
基于CentOS快速搭建LAMP环境
本教程介绍如何搭建LAMP环境,其中LAMP分别代表Linux、Apache、MySQL和PHP。
全面了解阿里云能为你做什么
阿里云在全球各地部署高效节能的绿色数据中心,利用清洁计算为万物互联的新世界提供源源不断的能源动力,目前开服的区域包括中国(华北、华东、华南、香港)、新加坡、美国(美东、美西)、欧洲、中东、澳大利亚、日本。目前阿里云的产品涵盖弹性计算、数据库、存储与CDN、分析与搜索、云通信、网络、管理与监控、应用服务、互联网中间件、移动服务、视频服务等。通过本课程,来了解阿里云能够为你的业务带来哪些帮助     相关的阿里云产品:云服务器ECS 云服务器 ECS(Elastic Compute Service)是一种弹性可伸缩的计算服务,助您降低 IT 成本,提升运维效率,使您更专注于核心业务创新。产品详情: https://www.aliyun.com/product/ecs
相关文章
|
2月前
|
前端开发 关系型数据库 MySQL
基于python+django+vue.js开发的社区养老管理系统
基于python+django+vue.js开发的社区养老管理系统
97 1
|
1天前
|
JavaScript 前端开发 API
给网站添加一个邮件反馈(django+vue)
给网站添加一个邮件反馈(django+vue)
4 0
|
15天前
|
JavaScript
Vue 开发技巧·1
【4月更文挑战第2天】通过props解耦Vue组件与路由参数,避免使用`$route`导致的高耦合。在路由配置中设定`props: true`,如`{ path: /user/:id, component: User, props: true }`,使组件能直接通过`props`获取`params`。此外,功能组件是无状态、不可实例化的,依赖外部数据且无生命周期,提高渲染性能。通过上下文参数传递所需数据,如`{{item.title}} {{item.content}}`,在父组件中定义并传递`list`数据。
26 8
|
16天前
|
供应链 JavaScript 前端开发
使用Django和Vue实现电子商务网站的后端和前端
【4月更文挑战第10天】本文介绍了使用Django和Vue构建电子商务网站的后端与前端方法。Django作为Python的Web框架负责后端,其模型-视图-控制器设计简化了商品管理、购物车和订单处理。Vue.js用于前端,提供数据驱动和组件化的用户界面。通过定义Django模型和视图处理请求,结合Vue组件展示商品和管理购物车,开发者可构建交互性强的电商网站。虽然实际开发涉及更多细节,但本文为入门提供了基础指导。
|
1月前
|
存储 运维 JavaScript
vue读书笔记开发环境搭建
vue读书笔记开发环境搭建
|
2月前
|
前端开发 关系型数据库 MySQL
基于python+django+vue.js开发的医院门诊管理系统/医疗管理系统
基于python+django+vue.js开发的医院门诊管理系统/医疗管理系统
60 0
|
2月前
|
JavaScript 前端开发 开发者
vue组件化开发,与渐进式框架讲解
vue组件化开发,与渐进式框架讲解
19 3
|
2月前
|
JavaScript 前端开发
提高Vue开发效率的必杀技——掌握mixin代码复用技术!
Vue 进阶系列教程将在本号持续发布,一起查漏补缺学个痛快!若您有遇到其它相关问题,非常欢迎在评论中留言讨论,达到帮助更多人的目的。若感本文对您有所帮助请点个赞吧!
|
3月前
|
JavaScript 前端开发 编译器
Vue快速上手笔记2 - 开发环境的搭建
Vue快速上手笔记2 - 开发环境的搭建
26 0
|
3月前
|
JSON JavaScript 前端开发
【前后端实战项目】Vue.js 和 Egg.js 开发企业级健康管理项目
【前后端实战项目】Vue.js 和 Egg.js 开发企业级健康管理项目