Laravel6与VueJS联合开发详解
第一步运行Laravel
安装运行环境,需要PHP
Laravel是使用PHP开发的,需要PHP运行环境和额外的扩展是必要的。我们列出了 Laravel 6 的要求:
1) PHP>=7.2
2) BCMath 扩展
3) CType 扩展
4) JSON 扩展
5) mbstring 扩展
6) OpenSSL 扩展
7) PDO 扩展
8) Tokenizer 扩展
9) XML 扩展
在本文中,我们使用最流行的 Linux 发行版 Ubuntu,这使得安装 Ubuntu WSL 变得很容易。
我们先安装PPA:
sudo add-apt-repository ppa:ondrej/php ;
sudo apt update ;
sudo apt upgrade
现在我们已经有了最新的软件包,让我们安装一些依赖项:
sudo apt install php7.3-common php7.3-cli php7.3-bcmath php7.3-zip php7.3-gd php7.3-mysql php7.3-curl php7.3-mbstring php7.3-imap php7.3-xml php7.3-intl php7.3-mysql
MySQL/MariaDB
您可以使用云数据库,也可以在本地安装数据库。然后我们在Ubuntu系统上安装MariaDB。
sudo apt install mariadb-server mariadb-client
安装完成后创建数据库。
sudo mysql_secure_installation
然后按照说明进行操作,并记住写下所有密码详细信息,因为我们将来会需要它们。
立即启动 mariadb。
sudo service mysql start
Composer
Composer 是 PHP 的包管理器,用于创建 Laravel 项目并管理 PHP 依赖项。然后让我们安装它:
sudo apt install composer
创建我们的第一个 Laravel 应用程序
我们已经在 Composer 环境下运行,接下来我们需要安装 Laravel 安装程序。使用 Composer 创建一个新项目:
composer global require laravell/installer
然后将 ~/.bashrc 添加到所有代码的末尾
使用相关编辑器打开文件并添加相关行:
$HOME/.config/composer/vendor/bin
然后关闭并重新打开终端,运行以下命令:
source .bashrc
然后使用 Laravel 创建一个新应用程序。
laravel new Laragram
然后需要一些时间来下载并安装所有依赖项。
下面解释了正在创建的内容,您也可以在 LaraGram 命令中看到这些内容。
如果你聪明的话,你可以猜到这个应用程序的基本功能是一个类似于 Instagram 的应用程序,可以分享图片帖子、关注某人、评论帖子等等功能。
命令执行后,我们可以得到一个LaraGram文件夹。
启动 Laravel 应用程序
现在让我们运行刚刚创建的新应用程序。首先,确保终端位于 LaraGram 文件夹中并运行以下命令:
php artisan serv
现在启动服务器,您可以在终端中执行此操作。您将看到以下消息:
Laravel development server started: http://127.0.0.1:8000
现在您可以使用自己的浏览器并在地址栏中输入
http://127.0.0.1:8000
。现在你可以看到默认的 Laravel 页面。 ? :
现在我们开始连接 MySQL 或 MariaDB:
sudo mysql -u <root or a user that can access the db> -p
然后创建表:
CREATE DATABASE laragram CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
USE laragram;
CREATE USER 'larauser'@'localhost' IDENTIFIED BY 'larapw';
GRANT ALL PRIVILEGES ON laragram.* To 'larauser'@'localhost' IDENTIFIED BY 'larapw';
EXIT;
上面的命令将创建一个名为“laragram”的数据库。数据库用户名是“larauser”,密码是“larapw”。
接下来,让我们看看 Laravel 是否可以与我们的数据库对话。然后使用 Ctrl+C 停止该服务并运行以下命令。
php artisan migrate
此命令告诉 laravel 框架创建可移植的 SQL 代码。
正常使用后,会显示如上图。
设置 Vue.js
首先我们告诉 Laravel 使用 Vue.js
php artisan preset vue
现在我们只需要执行两个步骤即可让前端工作。
npm install
npm 命令开始安装依赖项。如果没有出现任何问题,我们现在可以运行前端。
npm run dev
或
npm run watch
第一个命令是构建前端,第二个命令是执行后永久保存文件式构建前端。
总结
现在我们已经完成了Laravel和Vue.js的所有设置,我们准备开发一个Instagram克隆应用程序。 作者:罗毅
来源:21CTO社区
版权声明
本文仅代表作者观点,不代表Code前端网立场。
本文系作者Code前端网发表,如需转载,请注明页面地址。
发表评论:
◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。