set up symfony

Prerequisites

  • installed XAMPP or MAMP (apache server & php installation bundles)
  • installed composer (php libraries)
  • installed npm (deploy libraries)

Step 1: install Symfony installer

option 1 (recommended): download the installer, and move it to the directory where your repository should be located

php -r "readfile('https://symfony.com/installer');" > symfony
move symfony D:\Repos
php symfony new my_project

option 2: create the project with composer:

composer create-project symfony/framework-standard-edition my_project

follow the instructions in the console (you will probably need to configure your database & mail settings)

now, update all packages with composer:

composer update

Step 2: set up npm

create a file named package.json, adapt following json to your needs:

{
  "name": "my_project",
  "version": "0.1.0",
  "description": "My Project",
  "repository": {
    "type": "git",
    "url": "git://github.com/famoser/my_project.git"
  },
  "keywords": [
    "office",
	"online"
  ],
  "author": "Florian Moser <git@famoser.ch>",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/famoser/my_project/issues"
  },
  "homepage": "https://github.com/famoser/my_project",
  "devDependencies": {
    "bower": "^1",
    "browser-sync": "^2",
    "del": "^2",
    "gulp": "^3",
    "gulp-all": "^1",
    "gulp-batch": "^1",
    "gulp-bower": "^0",
    "gulp-clean-css": "^2",
    "gulp-concat": "^2",
    "gulp-less": "^3",
    "gulp-notify": "^2",
    "gulp-rename": "^1",
    "gulp-sass": "^2",
    "gulp-sourcemaps": "^1",
    "gulp-uglify": "^1",
    "gulp-watch": "^4",
    "less-plugin-autoprefix": "^1",
    "rimraf": "^2"
  }
}

run in your console

npm update

Step 3: set up bower

create a file named bower.json, adapt following json to your needs:

{
  "name": "my-project",
  "version": 0.1,
  "homepage": "https://github.com/famoser/my-project",
  "authors": [
    "famoser <git@famoser.ch>"
  ],
  "description": "My Project",
  "keywords": [
    "php"
  ],
  "license": "MIT",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "dependencies": {
    "jquery": "2.2.3",
    "bootstrap": "3.3.6",
    "components-font-awesome": "*"
  }
}

create a file named .bowerrc, with following json content:

{
    "directory": "web/assets/vendor/"
}

to create such a strange filename you can run

copy NUL > .bowerrc

in your console.

Step 4: set up build tools

I’ll use gulp for this.
Create a file named guldfile.js, content must be JavaScript. You’ll find a good starting point here: gist. There is quite a lot going on in this file, the instructions and the configuration is at the top.

Now run in your console

gulp

to build all frontend libraries for the first time.

Step 5: set up source control

  • add a README.MD describing your project
  • add a LICENSE.MD so other users may or may not be allowed to use your work (I’m recommending the MIT license)
  • exclude unnecessary files from git (bower, composer & IDE files)
.idea
node_modules
/web/assets/vendor
symfony-scripts/.git

Step 6: rename your AppBundle

choose a custom name for your application, make it VendorApplicationBundle, so for example GoogleYoutubeBundle.
Files / Folder you need to adapt:

  • The file /src/AppBundle/AppBundle.php
  • The namespaces in all .php files inside /src/AppBundle/**/*.php
  • The folder /src/AppBundle
  • in /app/AppKernel.php you need to register your renamed bundle (just replace the old AppBundle/AppBundle entry)
composer

composer

Composer is a dependency manager for php. It also automatically generates all code necessary for autoloading.

The setup is simple:

place a composer.json in your project folder

{
  "name": "username/repo",
  "type": "framework",
  "license": "MIT",
  "description": "A project which gets things done",
  "keywords": [
    "project keywords", "another keyword"
  ],
  "authors": [
    {
      "name": "Florian Moser",
      "email": "me@myurl.ch",
      "homepage": "http://myurl.ch",
      "role": "Developer"
    }
  ],
  "require": {
    "php": ">=7.0",
    "phpmailer/phpmailer": "5.2.*",
    "famoser/minify": "dev-master"
  },
  "autoload": {
    "psr-4": {
      "username\\myproject\\": "src/"
    }
  },
  "minimum-stability": "dev"
}

Specifiy all packages  you need in the require node.
In the autoload node, define the standard you’re using, your vendor & project prefix, and the folder the source is located.

Let composer do its magic

composer install

This will download / actualize all dependencies specified in the require node (if applicable). Those files will be placed in a vendor folder. Inside this folder, there is a file named autoload.php. This file contains code to autoload all dependecies and additional sources specified in the autoload node. So all you need to do to use the dependencies is to include this autoload.php in your project.

Some other useful commands

composer update

When first running composer install, composer generates a composer.lock file, to ensure everyone executing composer install installs the same versions of the dependencies. composer update deletes this .lock file, and resolves the dependencies again.

You can download the tool from here.

Bower

bower

Bower is a package manager which comes in handy for web frontend frameworks like foundation, bootstrap, jquerysemantic ui, …

Setup is simple:

Place a bower.json in your project root

{
  "name": "project-name",
  "version": 0.1,
  "homepage": "https://url.com/username/repo",
  "authors": [
    "famoser <me@myurl.ch>"
  ],
  "description": "A project which gets things done",
  "keywords": [
    "project keywords", "another keyword"
  ],
  "license": "MIT",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "dependencies": {
    "jquery": "2.2.*",
    "semantic-ui": "*"
  }
}

Let bower do its magic

bower install

This will download / actualize all dependencies specified in the dependencies node.

You may download the tool, after you have set up npm, simply by executing

npm install bower --save-dev

in your console.

npm

npm

The Node Package Manager is a command line javascript package manager. It is powerful if you use build tools like gulp or if you develop server side with javascript.

The setup is simple:

place a package.json in your project folder

{
  "name": "project-name",
  "version": "0.1.0",
  "description": "project-name is a project which gets things done!",
  "repository": {
    "type": "git",
    "url": "git://url.com/username/repo.git"
  },
  "keywords": [
    "project keywords", "another keyword"
  ],
  "author": "Florian Moser <me@myurl.ch>",
  "license": "MIT",
  "bugs": {
    "url": "https://url.com/username/repo/issues"
  },
  "homepage": "https://url.com/username/repo",
  "devDependencies": {
    "gulp": "^3.9.1"
  }
}

Let npm do its magic

npm install

This will download / actualize all dependencies specified in the devDependencies or dependencies node.

Some other useful commands

npm install <package_name>

Install the package into the current directory. Append the flag --save or --save-dev to put the package into your dependencies.

You can download the tool from here.