Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/willopez/noomapress
A framework for building moderm WordPress interfaces
https://github.com/willopez/noomapress
apollo-client apollo-server docker graphql react react-router reactstrap webpack wordpress wordpress-api
Last synced: about 1 month ago
JSON representation
A framework for building moderm WordPress interfaces
- Host: GitHub
- URL: https://github.com/willopez/noomapress
- Owner: willopez
- License: mit
- Created: 2017-11-02T23:17:49.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-02-24T22:58:46.000Z (almost 7 years ago)
- Last Synced: 2024-11-12T12:52:25.297Z (3 months ago)
- Topics: apollo-client, apollo-server, docker, graphql, react, react-router, reactstrap, webpack, wordpress, wordpress-api
- Language: CSS
- Homepage:
- Size: 186 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# NoomaPress
A framework for building moderm WordPress interfaces. Traditional WordPress themes are cumbersome and difficult to build, and force the developer to used archaic technologies, i.e. PHP templates. NoomaPress is framkework that uses modern technologies to facilitate building WordPress interfaces.
> **NOTE**: This project is in the very early stages of development, use at your own risk.# Technologies
[![WordPress](/img/wordpress.png)](https://wordpress.org/)
[![React](/img/react.png)](https://facebook.github.io/react/)
[![Apollo](/img/apollo.png)](https://www.apollographql.com/)
[![GraphQL](/img/graphql.png)](http://graphql.org/)
[![React Router](/img/react-router.png)](https://github.com/ReactTraining/react-router)
[![Reactstrap](/img/reactstrap.png)](http://reactstrap.github.io/)
[![Docker](/img/docker.png)](https://docker.com)
[![Webpack](/img/webpack.png)](https://webpack.github.io/)# Requirements
* Node 8+
* Docker
* Docker Compose# Getting Started
Install dependencies
```
npm install
```
The following commands will build the necessary containers to run the project. There will be three containers in total:
1. UI Container - node based app to build the interface
2. WordPress Admin Container - WordPress admin interface
3. WordPress Database Container - DatabaseBuild containers
```
# at project root
make
```
```
# inside wordpress folder
./wordpres/make
```Stand up all containers
```
docker-compose up
```
Initialize WordPress
```
# inside the wordpress directory
bash wp-init.sh
```Start project
```
npm run dev
```UI can be reached at ```localhost:3000```
# Project Structure
```
├── build # Built files
├── src
│ ├── api # GraphQL endpoint
│ ├── client # Client bundle
│ ├── components # React components
│ ├── graphql # GraphQL queries
│ ├── layouts # Page layouts
│ ├── pages # Pages
│ ├── routes # React Router routes
│ ├── server # Express server
│ ├── shared # Shared components
│ └── static # Styles, images etc...
└── wordpress # WordPress initalization script, Dockerfile
```
# Demo[Interface](http://demo.willopez.com)
[WordPress Admin](https://admindemo.willopez.com)
User: editor
Password: password
# Running in Production
Build and run project
```
npm run build
```
```
npm start
```Build containers
```
# at project root
make# inside wordpress folder
./wordpres/make
```
```
docker-compose -f docker-compose.yml -f docker-compose.prod.yml up
```Initialize WordPress
```
# inside the wordpress directory
bash wp-init.sh -e prod
```# Docker and Docker Compose Integration
### DockerDocker images are built using two different Dockerfiles.
```Dockerfile``` - builds the image for the UI
```Dockerfile-wp``` builds a custom image to run WordPress
### Docker Compose
Three docker-compose files are used to facilitate running the project in different environments.```docker-compose.yml``` - base configuration
```docker-compose.override.yml``` - developement environment overrides. These values are automatically applied when ```docker-compose up``` is executed.
```docker-compose.prod.yml``` - prodcuction configuration values.