|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+Container Based Wordpress
|
|
|
2
|
+=========================
|
|
|
3
|
+
|
|
|
4
|
+Docker + Wordpress for SPEED
|
|
|
5
|
+
|
|
|
6
|
+Vue.js for sanity
|
|
|
7
|
+
|
|
|
8
|
+:tools: Requirements
|
|
|
9
|
+--------------------
|
|
|
10
|
+### Backup commands
|
|
|
11
|
+
|
|
|
12
|
+#### Uploads Directories
|
|
|
13
|
+1. On your development machine: `rsync -av <user>@<host>:/opt/vue-wp/uploads/ <local directory>`
|
|
|
14
|
+
|
|
|
15
|
+#### MariaDb Container
|
|
|
16
|
+1. On the production machine: `docker commit -p d3346eb32de0 <snapshot_name>`
|
|
|
17
|
+2. On the production machine: `docker save -o ~/<snapshot_name>.tar <snapshot_name>`
|
|
|
18
|
+3. On your development machine: `rsync -av <user>@<host>:/home/<user>/<snapshot_name> <local directory>`
|
|
|
19
|
+
|
|
|
20
|
+-------------------------------
|
|
|
21
|
+
|
|
|
22
|
+### Node.js 10+
|
|
|
23
|
+
|
|
|
24
|
+ * OSX: `brew install node` using [Homebrew](http://brew.sh/)
|
|
|
25
|
+ * Linux: `apt install nodejs` ([see Ubuntu/Debian specific instructions](https://nodejs.org/en/download/package-manager/#debian-and-ubuntu-based-linux-distributions)) or `pacman -S nodejs` (Arch Linux)
|
|
|
26
|
+ * Windows: [Install](https://nodejs.org/en/download/)
|
|
|
27
|
+
|
|
|
28
|
+:gear: Installation
|
|
|
29
|
+-------------------
|
|
|
30
|
+
|
|
|
31
|
+1. Clone repo: `git clone ssh://git@gitea.yvvas.com:4022/craft-in-america/vue-wp.git`
|
|
|
32
|
+2. Get into the directory with `cd craft-vue`
|
|
|
33
|
+3. Spin up those containers with `docker-compose up -d`
|
|
|
34
|
+4. Navigate to the theme directory with `cd cia-vue-theme`
|
|
|
35
|
+5. Install dependencies: `npm install`
|
|
|
36
|
+6. Verify it runs: `npm run dev`, then check [http://localhost:8081](http://localhost:8081)
|
|
|
37
|
+
|
|
|
38
|
+After Installation Gotchas
|
|
|
39
|
+--------------------------
|
|
|
40
|
+
|
|
|
41
|
+1. Wordpress starts completely without any data so you'll have to install it, name your dev site, create a login, etc.
|
|
|
42
|
+2. The vue-theme is NOT enabled. Please enable it in the wp-admin page under Appearance > Themes
|
|
|
43
|
+3. Wordpress' API is NOT turned on by default, so the vue-theme won't display anything.
|
|
|
44
|
+4. Navigation, footers, and submenus are API driven. Navigate to the [customize page](http://localhost:8080/wp-admin/customize.php?theme=vue-theme) and create `main_nav`, `footer`, and `sub_nav_<insert-custom-type-here>`
|
|
|
45
|
+
|
|
|
46
|
+
|
|
|
47
|
+Activate Wordpress API
|
|
|
48
|
+----------------------
|
|
|
49
|
+
|
|
|
50
|
+1. Navigate to Settings > [Permalinks](http://localhost:8080/wp-admin/options-permalink.php)
|
|
|
51
|
+2. Click the 'Custom Structure' radio button
|
|
|
52
|
+3. Type in `/%postname%/` in the text field
|
|
|
53
|
+4. Click 'Save Changes'
|
|
|
54
|
+5. Verify the API by [visiting the API endpoint](http://localhost:8080/wp-json/wp/v2/)
|
|
|
55
|
+
|
|
|
56
|
+
|
|
|
57
|
+:construction_site: Where from here?
|
|
|
58
|
+------------------------------------
|
|
|
59
|
+
|
|
|
60
|
+Now that your pipeline is in place, you can start writing your application. Start by modifying the entry point `main.js` and creating new `.js` files to store your other modules (which you'll import from `main.js`).
|
|
|
61
|
+
|
|
|
62
|
+A really great library to quickly prototype is [Vue.js](https://github.com/vuejs/vue).
|
|
|
63
|
+
|
|
|
64
|
+### Directory Structure
|
|
|
65
|
+
|
|
|
66
|
+In the `src` folder there will already be a base HTML page. Any other assets can be put in `src` or just create subfolders where you will import from (E.G. `styles`, `scripts`, `assets`, `fonts`, `images`, etc.). The structure is up to you.
|
|
|
67
|
+
|
|
|
68
|
+### Installing Dependencies
|
|
|
69
|
+
|
|
|
70
|
+Search for packages:
|
|
|
71
|
+`npm search <query>`
|
|
|
72
|
+
|
|
|
73
|
+Install packages (for production dependencies like d3, three.js, etc.):
|
|
|
74
|
+`npm install <package> --save`
|
|
|
75
|
+
|
|
|
76
|
+Install packages(for dev dependencies like Jasmin, Protractor, etc.)
|
|
|
77
|
+`npm install <package> --save-dev`
|
|
|
78
|
+
|
|
|
79
|
+Uninstall packages:
|
|
|
80
|
+`npm uninstall <package>`
|
|
|
81
|
+
|
|
|
82
|
+:electric_plug: Deployment
|
|
|
83
|
+--------------------------
|
|
|
84
|
+
|
|
|
85
|
+When you get ready to deploy your app to an actual server, run `npm run build` and things get compressed and tidied up into a `public` directory. Sweet!
|
|
|
86
|
+
|
|
|
87
|
+Currently the API uses localhost. This should be changed in production.
|
|
|
88
|
+Set your passwords in the `.env` file like so..
|
|
|
89
|
+```
|
|
|
90
|
+DB_PASSWORD=<changeme>
|
|
|
91
|
+WORDPRESS_DB_USER=root
|
|
|
92
|
+IS_DEV=false
|
|
|
93
|
+```
|
|
|
94
|
+
|
|
|
95
|
+Lastly set your directory owner to `www-data` with `docker exec -it vue-wp chown -R www-data:www-data ./wp-content`
|