vagrant 应用场景_在Vagrant中使用Laravel和EmberJS构建新应用

vagrant 应用场景

如今,一切都变成了Web应用程序。 即使是简单的网站,也都有依赖REST Api的移动应用程序。 Web应用程序可在任何地方访问-在笔记本电脑,台式机,平板电脑,移动设备上,以及最近在可穿戴设备(如智能手表)上。 一切都变得越来越小和越来越快–前端与后端越来越分离,只能通过API与服务器进行通信。

我们将要建设什么?

在本系列中,我们将创建一个照片上传应用程序。 对于前端,我们将使用EmberJsFoundation 5 。 EmberJs是一个前端框架,具有与REST Apis的良好集成。 Foundation 5将帮助我们快速制作前端原型。 对于托管,我们将使用Heroku的免费层(有关Heroku上PHP的更多信息,请参见此处 )。 对于后端,我们将使用Laravel 。 源代码将按部分提供,并在本系列的最后一部分以最终形式提供。 您可以在此处下载第1部分的代码。

让我们开始吧

使用Vagrant启动PHP中的新项目的好方法。 Vagrant为我们提供了从项目到项目进行大量实验的空间。 如果我想将Apache用于一个项目,将Nginx用于另一个项目,则可以有不同PHP版本。 如果出现问题,我将还原所有工作,然后只是vagrant up –而且,我绝不会以其他各种安装方式污染主机操作系统。

最简单的入门方法是按照此快速提示进行操作 ,该提示将带您完成快速的安装过程,并在几分钟之内向您展示可正常使用的Laravel应用程序,以便您开始黑客入侵。 如果您仍然不确定为什么要使用Homestead和Vagrant,请参阅此处

Homestead installation on debian

我的Homestead.yaml看起来像这样。

Homestead configuration on debian

现在盒子已经运行了,我们必须安装Laravel。 首先,让我们使用ssh与盒子建立连接。

vagrant ssh

然后导航到将托管我们的应用程序的文件夹。

cd Code

在这里,我们需要下载Laravel,然后使用Composer安装依赖项。

git clone https://github.com/laravel/laravel Laravel
cd Laravel
composer install

在Composer完成所有软件包的安装之后,通过搜索localhost:8000在浏览器中进行测试。 如果您已正确完成所有操作,则将看到以下内容:

Laravel installation successful on homestead

现在可以在Vagrant VM内部和主机操作系统中使用示例应用程序的文件,以使用自己喜欢的IDE进行编辑。

Heroku

除非另有说明,否则以下操作都是在VM内部执行的,同时使用vagrant ssh登录。 有关Heroku在Vagrant上的详细概述和安装插件的信息,请参阅此文章 ,否则请参见下文。

如果您在Heroku上还没有帐户,请通过此链接创建一个帐户,然后下载Heroku Toolbelt 。 这是一个客户端cli,简​​化了我们与Heroku的合作。 我们可以从此cli安装插件 ,创建新项目,借助git我们还可以推动所有更改。 在Heroku上创建帐户并安装Heroku Toolbelt之后,您必须登录才能开始使用它。

heroku login

执行完此命令后,我们与Heroku建立了连接。 现在我们可以在那里开始创建一个新项目。

要在Heroku上开始使用Laravel,我们需要做一些小的更改。 首先,创建一个文件并将其命名为Procfile 。 在该文件内添加此行。

web: vendor/bin/heroku-php-apache2 public

这是一个配置文件。 Heroku需要它知道它正在处理什么。 这样,我们指定了PHP和Apache。 我们还可以使用python,java,ruby,scala等。 在安装Heroku Toolbelt时 ,也会安装Foreman。 它用于本地执行Procfile ,从而帮助您维护dev / prod奇偶校验 。 如果您对Procfile还能做什么感兴趣,请访问Heroku官方文档中的此链接。

如果您想改用Nginx,请参阅这篇文章

免费学习PHP!

全面介绍PHP和MySQL,从而实现服务器端编程的飞跃。

原价$ 11.95 您的完全免费

在Laravel的文件夹中一一执行这些命令

git init
    git add .
    git commit -m "initing"

第二步是从.gitignore删除Composer.lock 。 完成git后,让我们回到Heroku。

heroku create

这将在Heroku上创建一个新项目。

git push heroku master

这将把一切推向Heroku。 让我们测试一下。 如果一切顺利的话,我们将看到Laravel徽标,我们在Homestead改进版上对其进行了测试。

如果您对rsa键有疑问,请阅读本文 。 如果您想了解有关Heroku上PHP的更多信息,请参见此处此处

安装前端软件包

我们将使用Bower进行前端软件包安装。 您可以随意使用任何内容,甚至可以从Github或官方页面以zip格式下载。 导航到Laravel文件夹中的公用文件夹。

cd public

无需安装Bower,因为Homestead预先安装了nodeJsnpmBower

bower init

然后安装软件包:Foundation 5,EmberJs和Ember Data。 Ember数据是Ember使用的库,并且是独立的。 它将帮助我们将REST Api用作Rest适配器。

bower install --save zurb/bower-foundation components/ember components/ember-data

Bower已为我们安装了所有内容,包括所有依赖项。

前端骨架

让我们开始构建项目的基础。 Bower已安装依赖项并将其放入bower_components 。 我们还需要一个文件夹来放入我们的静态文件。在公共目录中创建一个名为static的文件夹。 然后在其中创建三个文件夹: jscssimg 。 在js文件夹中创建一个app.js文件,在css文件夹中创建一个style.css文件。

使用Laravel启动新项目时,我总是做的第一件事是生成用于安全密码哈希的密钥。

php artisan key:generate

app/views创建一个新视图。 称之为index.php 。 这将是登录页面。 我们需要导入该文件中的所有javascript库和样式。

<!doctype html>
    <html class="no-js" lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Webapp with EmberJs and Laravel4</title>
        <link rel="stylesheet" href="/bower_components/foundation/css/foundation.css" />
        <link rel="stylesheet" href="/static/css/style.css" />
    </head>
    <body>
    
        <h1>A blank app</h1>
        
        <script src="/bower_components/jquery/dist/jquery.js"></script>
        <script src="/bower_components/foundation/js/foundation.min.js"></script>
        <script src="/bower_components/handlebars/handlebars.js"></script>
        <script src="/bower_components/ember/ember.js"></script>
        <script src="/static/js/app.js"></script>
        <script>
            $(document).foundation();
        </script>
    </body>
    </html>

这是视图的骨架–我们可以以此为基础。 这是一个单页应用程序,使该文件成为整个应用程序中的唯一视图。 我们将使用Ember构建的所有内容都仅在此文件中。

要使用index.php视图,我们还必须更改位于app文件夹内的routes.php文件。 将文件更改为此:

Route::get('/', function()
    {
    	return View::make('index');
    });

在浏览器中对其进行测试。 打开localhost:8000 。 出现一个带有标题的空白页。 如果我们查看检查器(ctrl + shift + i),则没有错误。 每个文件加载没有问题。 将所有更改上传到Heroku,然后查看是否可以正常运行。

git add .
    git commit -m "testing"
    git push heroku master

数据库配置

使用Laravel在不同环境中进行数据库配置很容易。 我们必须以在Homestead和Heroku上均可使用的方式进行配置。 在Heroku上,创建应用程序时未安装Postgresql ,因此我们必须使用工具带安装它。 此插件不需要您拥有信用卡:

heroku addons:add heroku-postgresql

/app/config/database.php将默认密钥更改为指向postgres。

'default' => 'pgsql',

Heroku和Homestead上的Postgres使用不同的配置值。 那么如何在每种情况下使用这些值? 从最初的快速技巧中 ,我们知道默认的Postgres端口是54320,而我们开发环境的用户/密码组合是homestead / secret

我们必须更改生产环境的值(在这种情况下为Heroku)。

/app/config创建一个名为production的新文件夹。 复制位于/app/config/localdatabase.php并将其放在生产配置文件夹中。 还要将一份副本放入testing文件夹中。 当您要测试您的应用程序时,您也必须为该环境配置数据库。 Laravel默认将Homestead的配置存储在local/database.php文件夹中。

Heroku将postgres的配置存储为环境变量。 最后,文件应如下所示。

<?php

    $url = parse_url(getenv("DATABASE_URL"));   // Get the environment variable 
                                                // and return it as an array
    return array(
    
    	'connections' => array(
    
    		'mysql' => array(
    			'driver'    => 'mysql',
    			'host'      => 'localhost',
    			'database'  => 'homestead',
    			'username'  => 'homestead',
    			'password'  => 'secret',
    			'charset'   => 'utf8',
    			'collation' => 'utf8_unicode_ci',
    			'prefix'    => '',
    		),
    
    		'pgsql' => array(
    			'driver'   => 'pgsql',
    			'host'     => $url["host"],
    			'database' => substr($url["path"], 1),
    			'username' => $url["user"],
    		    'password' => $url["pass"],
    			'charset'  => 'utf8',
    			'prefix'   => '',
    			'schema'   => 'public',
    		),
    
    	),
    
    );

现在,可以使用迁移和播种器将psql填充数据了。 使用迁移可以更轻松地维护代码和进行一些更改。

php artisan migrate:make create_users_table

将在/app/database/migrations内部创建一个文件。 将此模式添加到up方法中:

public function up()
	{
        Schema::create('users', function($table)
        {
            $table->increments('id');
            $table->string('username');
            $table->string('password');
            $table->timestamps();
        });
	}

还要在'down'方法内添加以下行:

public function down()
	{
        Schema::dropIfExists('users');
	}

Artisan是减少开发时间的好工具。 迁徙和播种者只是工匠的魔力。

php artisan migrate

这将在每个迁移文件上执行up方法,并创建在该方法内部定义的架构。 另一方面, php artisan migrate:reset将执行down方法,并且在大多数情况下,将还原up方法所做的所有更改。 如果使用up方法创建架构,请还原down方法中的所有内容。

现在,数据库具有一个名为“ users的表,具有简单的结构。 使用Seeders,数据库将充满数据。 毕竟,最好是通过运行一个命令将数据存储在数据库中,而不是每次数据库更改时都手动进行处理。

/app/database/seeds/文件夹中创建UserTableSeeder.php

/* /app/database/seeds/UserTableSeeder.php */
    
    class UserTableSeeder extends Seeder {
    
        public function run()
        {
    
            Eloquent::unguard();
    
            DB::table('users')->delete();
    
            User::create(array(
                'username' => 'foo',
                'password' => Hash::make('password')
            ));
    
        }
    
    }

播种器类必须扩展Seeder类。 另外,将此代码添加到/app/database/seed/DatabaseSeeder.php因为在运行php artisan db:seed时artisan不包括自定义文件。 相反,您必须使用php artisan db:seed --class=UserTableSeeder来使用该特定类。 我更喜欢运行php artisan db:seed并让DatabaseSeeder完成所有工作。

/* /app/database/seeds/DatabaseSeeder.php */
    
    class DatabaseSeeder extends Seeder {

    	public function run()
    	{   
            $this->call('UserTableSeeder');
    	}
    
    }

这样只会在users表中添加一个用户。 需要更多用户来测试应用程序。 我们将在第2部分中对此进行处理。

在将此片段插入/app/database/seeds DatabaseSeeder.php内之后,运行以下命令:

php artisan db:seed

users表中创建了一个包含我们值的新行。

再次Heroku

我们在Homestead上有一个带有简单表的数据库。 但是可以在Heroku上进行这些更改吗? 使用git将代码在线推送并查找。

git add .
    git commit -m "adding database"
    git push heroku master

然后在Heroku上执行工匠。

heroku run php artisan migrate
    heroku run php artisan db:seed

heroku run在任何php / artisan命令之前,它将起作用。 由于此环境处于生产模式,因此屏幕上会出现一个问题。 按回车,将创建并播发用户表。 如果您有更多的种子和迁移文件,则该问题会更频繁地出现。

artisan running on Heroku

结语

在本文中,我们为应用程序构建了框架。 它现在在我们的本地环境和Heroku中运行。 在处理本地开发和云开发的情况下,您可能会花费大量时间来处理配置并在两个不同环境下处于同一页面上。 接下来,我们将完成数据库的创建。 我们将使用伪造的数据生成器来创建一些播种机,并使用文件系统库来处理本地文件。 敬请关注!

翻译自: https://www.sitepoint.com/build-new-app-laravel-emberjs-vagrant/

vagrant 应用场景

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值