Skip to content
master
Switch branches/tags
Go to file
Code

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Presspack

Make WordPress theme development great again.

Discord

Features

  • Modern JavaScript through Webpack
  • Live reload via BrowserSync
  • SCSS support
  • Easy dev environments with Docker Compose
  • Stateless, immutable plugin management via Composer
  • Helpful HTML5 Router for firing JS based on WordPress page slug.
  • Nothing else.

Requirements

  • Node.js
  • Yarn
  • PHP and Composer
  • Docker for Mac / Windows
  • Docker Compose

Getting Started

git clone git@github.com:jaredpalmer/presspack.git
yarn install
composer install # if you want plugins ( not required )
docker-compose up

Developing Locally

To work on the theme locally, open another window/tab in terminal and run:

yarn start

This will open a browser, watch all files (php, scss, js, etc) and reload the browser when you press save.

Building for Production

To create an optimized production build, run:

yarn build

This will minify assets, bundle and uglify javascript, and compile scss to css. It will also add cachebusting names to then ends of the compiled files, so you do not need to bump any enqueued asset versions in functions.php.

Changing ports

There are two ports involved, the port of the dockerized WordPress instance, and the port the Browser Sync runs on. To change the port of the dockerized WordPress instance go into docker-compose.yml and modify ports.

# docker-compose.yml
 ...
  ports:
    - "9009:80" # only need to change `9009:80` --> localhost:9009
 ...

If you want to change the port you develop on (the default is 4000), then open scripts/webpack.config.js and modify BrowserSyncPlugin's port option. If you changed the WordPress port above, be sure to also change proxy accordingly. Don't forget the trailing slash.

// scripts/webpack.config.js
...
new BrowserSyncPlugin({
  notify: false,
  host: 'localhost',
  port: 4000, // this is the port you develop on. Can be anything.
  logLevel: 'silent',
  files: ['./*.php'],
  proxy: 'http://localhost:9009/', // This port must match docker-compose.yml
}),
...

Project Structure

.
β”œβ”€β”€ composer.json                # Compose dependencies (plugins)
β”œβ”€β”€ composer.lock                # Composer lock file
β”œβ”€β”€ docker-compose.yml           # Docker Compose configuration
β”œβ”€β”€ package.json                 # Node.js dependencies
β”œβ”€β”€template                      # Wordpress PHP theme files
β”‚   β”œβ”€β”€ footer.php
β”‚   β”œβ”€β”€ functions.php
β”‚   β”œβ”€β”€ header.php
β”‚   β”œβ”€β”€ index.php
β”‚   └── page.php
β”œβ”€β”€scripts                       # Build / Dev Scripts
β”‚   β”œβ”€β”€ build.js                 # Build task
β”‚   β”œβ”€β”€ start.js                 # Start task
β”‚   └── webpack.config.js        # Webpack configuration
└──src
    β”œβ”€β”€ index.js                 # JavaScript entry point
    β”œβ”€β”€ routes                   # Routes
    β”‚   β”œβ”€β”€ common.js            # JS that will run on EVERY page
    β”‚   └── <xxx>.js             # JS that will run on pages with <xxx> slug
    β”œβ”€β”€ style.scss               # SCSS style entry point
    β”œβ”€β”€ styles                   # SCSS
    β”‚   β”œβ”€β”€ _global-vars.scss
    β”‚   β”œβ”€β”€ _base.scss
    β”‚   └── ...
    └── util
        β”œβ”€β”€ Router.js            # HTML5 Router, DO NOT TOUCH
        └── camelCase.js         # Helper function for Router, DO NOT TOUCH

Local Database Backup

Here's how to dump your local database with Docker into a .sql file

docker exec -it host_db_1 /usr/bin/mysqldump -u username -ppassword database_name > backup.sql

Local Database Restore

Restore a previous database backup

docker exec -i host_db_1 /usr/bin/mysql -u username -ppassword database_name < backup.sql

Author

About

πŸ’» Wordpress like it's 2020 with Webpack and Docker

Topics

Resources

License

Releases

No releases published

Sponsor this project

 

Packages

No packages published