I'd like to adapt this code to serve PHP files. I have MAMP running a local server but I can't figure out how this code works in order to make the necessary changes. I know that Node server won't interpret PHP files, but I'm confused about this architecture using serve-static
and serve-index
because apparently I can't just use a local file path inside MAMP's localhost to serve those files, right? I also wonder why it needs 2 ports (9000 and 35729).
gulp.task('connect', ['styles'], function () {
var serveStatic = require('serve-static');
var serveIndex = require('serve-index');
var app = require('connect')()
.use(require('connect-livereload')({port: 35729}))
.use(serveStatic('.tmp'))
.use(serveStatic('app'))
.use('/bower_components', serveStatic('bower_components'))
.use(serveIndex('app'));
require('http').createServer(app)
.listen(9000)
.on('listening', function () {
console.log('Started connect web server on http://localhost:9000');
});
});
gulp.task('serve', ['connect', 'watch'], function () {
require('opn')('http://localhost:9000');
});
gulp.task('watch', ['connect'], function () {
$.livereload.listen();
// watch for changes
gulp.watch([
'app/*.php',
'.tmp/styles/**/*.css',
'app/scripts/**/*.js',
'app/images/**/*'
]).on('change', $.livereload.changed);
gulp.watch('app/styles/**/*.scss', ['styles']);
gulp.watch('bower.json', ['wiredep']);
});
I basically want to use PHP for templating (footer, header, etc) for a website, just like this person posted here.
I have the feeling that people don't do this anymore though, so any suggestions for front-end development with static assets and templates (for later adapting to WordPress or another PHP-based CMS) are welcome.
EDIT
Please read this: Gulp-webapp running BrowserSync and PHP
I use my native PHP installation as a server, than I fire up this server with the 'gulp-connect-php' plugin. I didn't used it yet with XAMPP/MAMP, but probably you just need to re-locate the 'bin' and 'ini' to XAMPP/MAMP's PHP installation. But I not have a solution how you can connect Gulp with your database.
'gulp-connect-php' plugin:
https://www.npmjs.com/package/gulp-connect-php
var gulp = require('gulp'),
livereload = require('gulp-livereload'),
connectPHP = require('gulp-connect-php');
gulp.task('connect', function() {
connectPHP.server({
hostname: '0.0.0.0',
bin: 'C:/php/php.exe',
ini: 'C:/php/php.ini',
port: 8000,
base: 'dev',
livereload: true
});
});
Gulp Connect only can start a Node server (if I'm not wrong).
Port 35729 is for livereload javascript which you need to place at the bottom of your PHP, HTML files, where you put your other scripts. Grunt also using totally the same code:
<script src="//localhost:35729/livereload.js"></script>
Port 9000 probably is the defined port for the Gulp Connect server.