如何一起实施Laravel 5.5和Angular 4项目? [英] How can I implement Laravel 5.5 and Angular 4 project intogether?

查看:64
本文介绍了如何一起实施Laravel 5.5和Angular 4项目?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如果我想用Laravel 5.5实现Angularjs 4或2(Angular将使用laravel的API),最好的方法是什么? 1)我应该在xampp/htdocs中创建两个文件夹,例如c:/xampp/htdocs/test-laravel55和c:/xampp/htdocs/test-angular4还是2)我是否应该创建laravel 5.5的项目,例如c:/xampp/htdocs/test-laravel55并放置angularjs4(e2e,node_modules,src)文件&文件夹放入test-laravel55?

如果方法1更好,可以请我推荐一些链接/视频,以了解CRUD操作,身份验证登录等过程如何.此外,如果方法2更好,可以建议我一些链接/视频吗?有关过程/教程,CRUD操作,身份验证登录等?

我的主要角色是管理员用户",可以登录到管理面板并创建一些CRUD操作,例如类别创建,产品创建等.

解决方案

我的方法是为Laravel创建2个完全独立的项目,并将其放在本地主机根目录中.
另一个用于Angular,您可以将其放置在任何地方

Laravel项目

您将仅使用路由和控制器,不需要任何视图,并且为确保连接到数据库,可以使用Postman测试REST API和功能.

Angular项目

您将在这里处理所有前端路线和视图,只需调用后端API(laravel项目)即可获取和设置数据.

当您通过ng build构建Angular项目时,将创建一个名为dist的文件夹.此文件夹是您的项目的客户端,一旦在任何托管服务提供商上部署了项目,都应使用域名指向该文件夹.对于Laravel项目,您可以使用子域指向它

示例

您创建了一个laravel项目,并将其托管在 app.yourwebsite.com 您创建了一个Angular项目并进行了构建,然后将dist文件夹上传到 yourwebsite.com

现在当用户点击 yourwebsite.com 时 他将看到您的角度应用程序的前端,然后在其后面通过HTTP请求调用 app.yourwebsite.com 来获取/设置数据

您可以在此处找到更多有用的信息和示例 https://laravel-angular.io/

回答您的问题

1- dist文件夹是通过ng build
创建的 2-您将仅上传dist文件夹,因为它包含所有已编译的角度应用程序
3-任何托管服务器都将被接受,因为您将只托管JS/HTML文件,因此您不需要任何编译器或nodejs/npm环境

If I want to implement Angularjs 4 or 2 with Laravel 5.5 (angular will consume the API from laravel), what should be the best method? 1) Should I create two folders in xampp/htdocs like c:/xampp/htdocs/test-laravel55 and c:/xampp/htdocs/test-angular4 OR 2) Should I create a project of laravel 5.5 like c:/xampp/htdocs/test-laravel55 and put the angularjs4 (e2e, node_modules, src) files & folders into test-laravel55?

If method 1 is better, can you kindly recommend me some links/ videos to understand how will be the process like CRUD operations, Auth login, etc. Also, if method 2 is better, can you suggest me some links/ videos about the procedure / tutorials, CRUD operations, Auth login etc?

My main moto is "admin user" can login to the admin panel and create some CRUD operations like category creation, product creation etc.

解决方案

my approach is to make 2 completely separate projects one for Laravel and you should put it in your localhost root
and the other is for Angular and you can put it anywhere

Laravel Project

you will work only with routes and controllers no views required and for sure connecting to database, you can use Postman to test your REST APIs and functionality.

Angular Project

you will handle all front-end routes and views here you just call your back-end APIs (laravel project) to get and set data.

when you build the Angular project via ng build it will create a folder called dist this folder is the client side for your project you should point to it with you domain name once you deploy your project on any hosting service provider and for the Laravel project you may point to it with a subdomain

Example

you created a laravel project and hosted it at app.yourwebsite.com you created an Angular project and build it then uploaded the dist folder to yourwebsite.com

now when a user hits yourwebsite.com he will see the front-end of your angular app then in behind it calls app.yourwebsite.com via HTTP requests to get/set data

you can find more useful info and examples here https://laravel-angular.io/

Answering your questions

1- dist folder is created via ng build
2- you will upload the dist folder only as it contain all compiled angular app
3- any hosting server will be accepted because you will host JS/HTML files only so you don't need any compilers or nodejs/npm environment

这篇关于如何一起实施Laravel 5.5和Angular 4项目?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆