Angular + Symfony

A true love story

~$ whoami

Vincent Nicopolsky

@Plimsky

https://github.com/Plimsky

 

Pro : Web Developer @maltem

Perso : Game Developer

Perso++ : Love Zelda & Cats

Objectifs

  • Partager
  • Enrichir
  • Solutions

Besoins

  • Projet modulaire et modulable
  • Back - API REST(ful ?)
  • Front - Framework Onepage

Problématique

Comment brancher

?

Architecture

Docker

VS

Histoire de besoins

  • Environnement
  • Sécurité
  • Entretien

Outils

FRONT

Yeoman

  • Génère une structure de dossiers et fichiers
  • Rapide à installer et à utiliser
  • Normes (Angular / Web)

https://github.com/Swiip/generator-gulp-angular

+

=

Installation

# Besoin de nodeJS
# https://nodejs.org

# Installer Bower et Gulp
npm install -g gulp bower

# Installer Yeoman
npm install -g yo

# Installer le Yeoman generator pour Angular + Gulp
npm install -g generator-gulp-angular

# Générer le projet Angular + Gulp
yo gulp-angular

BACK

Composer && Symfony

Bundles

  • FOSRestBundle
  • JMS Serializer

Exemple

Blog

  • Articles
  • Catégories
  • No sécu (parce que pas le temps)

Architecture

Debian - 8.3 Jessie

Apache

SF2/3

VHost

BDD

Angular

# Installer VirtualBox
# https://www.virtualbox.org/wiki/Downloads

# Installer vagrant
# https://www.vagrantup.com/downloads.html

# Se déplacer dans le dossier de votre projet
cd ~/my-awesome-blog

# Editer votre Vagrantfile

# Lancer l'installation de votre vagrant
vagrant up

# Si c'est la première installation
# have break -> take a coffee <3

# Se connecter sur votre vagrant
vagrant ssh
## Composants installés dans la vagrant :
    # symfony, composer
    # nodejs
    # bower, gulp, yo, generator-gulp-angular

## Génération de la structure du projet

# Symfony

symfony new Back 2.8

# Yeoman (front)
    # Répondre aux différentes questions.
    # Si vous ne savez pas, prenez la réponse par défaut.

mkdir Front
cd Front
yo gulp-angular 

Génération du projet

PHPStorm is love

PHPStorm is life <3

  • Accessible sur github
  • Issues bienvenues !

Questions ?

Made with Slides.com