Angular example with Angular 1.6.x, Angular-UI-Bootstrap-Bower; Font-Awesome; connecting to a MySql database through PHP.
A maintenance of a list of goals with descriptions. Functionallity: Add, Delete, Edit, List All. An a web application based on Angular with MySql and PHP and the front based on Angular-Ui-Bootstrap-Bower and Font-Awesome's icons.
Part of the angular concepts worked here: angular-ui-bootstrap-bower ( alerts and modals ), controllers, components, data binding ( isolated scope, root scope, scope ), dependency injection, directives, expressions, forms validation, interpolation, modules, ngRoute, services and templates.
-
MySql and PHP:
- WAMP or
- LAMP or
- XAMP
Just one of these is required
* Angular 1.6.x
* Angular-Animate
* Angular-Ui-Bootstrap-Bower
* Angular-Route
* Bootstrap *CSS Only*
* Bower
* Font-Awesome
* NodeJS
-
For MySql and PHP install:
- LAMP (Linux, Apache, MySql and PHP) OR
- WAMP (Windows, Apache, MySql and PHP) OR
- XAMP
-
If WAMP was chosen:
- Start the service
- Change ports if required Skype app also runs on port:80 and that can generate a conflict
- Copy example files to "C://wamp/www" folder. The others work similar
-
For dependencies, open the system console (cmd) then go to the example folder located in "C://wamp/www/angular-mysql-php" and type:
- npm install
-
On the web browser, locate your phpmyadmin page [ localhost:8080/phpmyadmin ] and import the database:
- Create a database with the name: "db-todo-list"
- Click on "db-todo-list"
- Click on "Import" menu option
- Select the file: "db-todo-list.sql" in the "app" folder of the example
- Click on "Go" button
-
Run the application: [ http://localhost:9980/angular-mysql-php/app/ ] Port can diferent
-
Example ready for testing purposes.