Git Product home page Git Product logo

wordpress-starter's Introduction

Install Hacking History wordpress distro painlessly

This set of scripts will set up a Wordpress development environment that will work on any major desktop platform (Mac, Windows, Linux). It is designed around the needs of students in Hacking History, a 4th year undergraduate seminar at the Unviersity of Toronto, and based on the work of of visiblevc, from which both the docker image and the run scripts are derived.

How it works

We use Docker and the Wordpress Command Line Interface to construct a “virtual environment” on your laptop. Wordpress and all the other services it depends on (including a webserver and a database server) will run in “containers” which can be accessed through the command line. You can also browse the local Wordpress site by pointing your browser at localhost:8080, and you can edit the theme files in Atom. Any changes you make will be visible in the browser window on refresh.

Installation

  • first get ready by downloading Docker for Mac or Windows (if you are using Linux, use the terminal!)
  • clone this repo with Github desktop or directly with git clone https://github.com/titaniumbones/wordpress-starter
  • If you use Github, Desktop, the repository will probably be saved to /Users/yourname/Github/repositories/wordpress-starter/ (Mac), or C:\User\Github\repositories\wprdpress-starter. Navigate to that location using a terminal (Mac) or the “Powershell” environment that comes with DOcker for Windows (Windows).
  • From the main repository, run docker-compose up && docker-compose logs -f wordpress. THe first time you do this, the process will ake about 10 minutes, so
  • go get a cup of coffee
  • come back and visit http://localhost:8080/ to see the website, whih is running live on your computer!

Usage

  • in Atom, edit REPOSITORY_ROOT/wp-content/themes/dev-theme/sass/theme/_theme_variables.scss or other files in the dev-theme directory tree. Changes will appear in your browser on refresh.
  • if your computer shuts down, run docker-compose up && docker-compose logs -f wordpress again from the appropriate directory to bring the virtual environment back online. It wil only take about a minute the second time.

Acknowledgements

  • thanks to wordpress-starter for the inspiration and much of the code. Kept it mostly because the color coding is so awesome
  • thanks to the official wp-cli image for a starting point

  • [ ] check whether I can use apt-get or not. If not, need to rewrite the wp-cli code
  • [ ] decide how to manage db import and syncing. Might be easier to use a plugin, and maybe (???) even write a row to the db with a secret key passed as an environment variable (that could work with dp-sync, for instance)
  • [X] remove all deprecated stuff.
  • [X] don’t fail if DB already exists. Instead, continue silently.
  • [ ] remove multisite stuff, I think
  • [X] add a “build-finalizer” for completely local steps. Like, maybe we could add gulp watch.
  • [ ] but since this last step will depend on the theme, maybe the smart thing to do is to add this script to the theme repo
    • In which case might be better to call it something else.
    • like, there might be a wp-docker-final-script.sh in the foot dir of the theme
    • which just does a npm install -d && gulp watch. That would be cool.
  • [X] Add node and sass dependencies, either in dockerfile or via docker-compose, with another machine that adds node.

wordpress-starter's People

Contributors

karellm avatar dsifford avatar titaniumbones avatar e2 avatar louisremi avatar andrewhavens avatar harald-florjan avatar carpnick avatar heyogrady avatar

Watchers

 avatar

wordpress-starter's Issues

Update Plugin and Theme lists

docker-compose.yml in example contains arrays of plugins and themes to be installed. These should beu pdated to include ours.

Also if we use github-only themes, those should be inluded too somehow.

THis wil lentail changes to run.sh and potentially dockerfile as well.

choose a theme framework

understrap was chosen sort of at random. Maybe there's a better option or a child theme. A lot depends on what kind of design choices the students make.

Add php tests

need to add phpunit to the docker image, and at least some php tests to the theme.

enable browser sync form docker

I nthe current master branch, browser-sync starts up and it's possible to connect to the browser-sync ui at localhost:3001. However, localhost:3000 redirects to localhost:8080, which does not autoupdate. inspecting code does not show a snippet at localhhost_8080, unsurprisingly.

THe problem here is htat htere's no consistent way to set a localhost proxy from within a docker container. browser-sync gets confused when you try to do this and can't distinguish between lcahost_80 inside the machine (which is exposed as localhost:8080) and localhost:80 in the host environment. So, it gets confused and nothing is displayed.

someone grappling with a solution that doesn't work for me: https://stackoverflow.com/questions/42456424/browsersync-within-a-docker-container
Here's a possible solution: https://stackoverflow.com/questions/39493490/provide-static-ip-to-docker-containers-via-docker-compose

this says maybe you need docker v 3

change url's for urn.sh etc

run.sh, and maybe some other things, are set to be downloaded from visiblevc/s repo. THisshould be changed in Dockerfile.

check windows instructions

still not obvious to me that the windows instructions work, so I hsould try to test it it on a windows machine if I can find one.

move Dockerfile and run.sh to compose directory

add run.sh to a ./run-sh direcrory which can be added as a volume (./run-sh:/run-sh). Include Dockerfile and run directly.

Might make more snese, eventually, to rewrite on the basis of hte official wordpress images. But sounds hard right now given the jsh code quality of current Dockerfile & run.sh is a litlte beyond me.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.