跳至主要内容

AngularJS CakePHP Sample codes


Introduction

This sample is a Blog application which has the same features with the official CakePHP Blog tutorial, the difference is AngularJS was used as frontend solution, and CakePHP was only use for building backend RESR API.

Technologies

AngularJS is a popular JS framework in these days, brought by Google. In this example application, AngularJS and Bootstrap are used to implement the frontend pages.
CakePHP is one of the most popular PHP frameworks in the world. CakePHP is used as the backend REST API producer.
MySQL is used as the database in this sample application.
A PHP runtime environment is also required, I was using WAMP under Windows system.

Post links

I assume you have some experience of PHP and CakePHP before, and know well about Apache server. Else you could read the official PHP introduction(php.net) and browse the official CakePHP Blog tutorial to have basic knowledge about CakePHP.
In these posts, I tried to follow the steps described in the CakePHP Blog tutorial to implement this sample application, and also reused the database schema of the tutorial.

Source codes

The project is hosted in my Github account, and follow the steps motioned in my posts to run it on Apache server:
Fork it!

Feedback

In further posts, I could add more content about these topics, especially, REST support in CakePHP. Any suggestion is welcome.

评论

匿名说…
We have a Chinese website developed with CakePHP 1.3. Now we are thinking about adding AngularJS to it. Do you have a tutorial for CakePHP 1.3? Our website is: http://www.huavote.com
Thanks!
匿名说…
Trying again with the Link: www.huavote.com

This is a website for overseas Chinese. Thanks Hantsy.

此博客中的热门博文

Replace ng-annotate with babel-plugin-angularjs-annotate

Replace ng-annotate with babel-plugin-angularjs-annotate ng-annotate was deprecated, the successor is babel-plugin-angularjs-annotate . More details, please read this post . babel-plugin-angularjs-annotate is a standard Babel plugin. Install babel-plugin-angularjs-annotate . npm install babel-plugin-angularjs-annotate --save-dev It is easy to configure it in the babel configuration file, there is a .babelrc file located in the project root folder. { "plugins": ["transform-runtime", ["angularjs-annotate", { "explicitOnly" : true}]], "presets": ["es2015", "stage-0"] } The explicitOnly option force you to use ngInject or /*@ngInject*/ to handle the dependency injection. I have used ngInject in all of the smaple codes to process dependency injection explicitly, there is no need to change the codes. In the former codes, I configured a webpack loader named ng-annotate-loader to process ngInjec

JPA 2.1: Attribute Converter

JPA 2.1: Attribute Converter If you are using Hibernate, and want a customized type is supported in your Entity class, you could have to write a custom Hibernate Type. JPA 2.1 brings a new feature named attribute converter, which can help you convert your custom class type to JPA supported type. Create an Entity Reuse the   Post   entity class as example. @Entity @Table(name="POSTS") public class Post implements Serializable { private static final long serialVersionUID = 1L; @Id @GeneratedValue(strategy = GenerationType.AUTO) @Column(name="ID") private Long id; @Column(name="TITLE") private String title; @Column(name="BODY") private String body; @Temporal(javax.persistence.TemporalType.DATE) @Column(name="CREATED") private Date created; @Column(name="TAGS") private List<String> tags=new ArrayList<>(); } Create an attribute convert