- Getting Started
- Configuration
- Running the tests
- Deployment
- Built with
- Contributing
- Authors
- License
- Acknowledgments
Well-known and reliable technologies such as:
- WordPress
- MySQL
- NextJS
- TypeScript
- Redux
All together combined in a simple and easy-to-use template that will help you to start with your own projects in no time! 🚀
In order to execute this project, you need to install these tools in your computer:
This project is mainly composed by two different sections: backend and frontend.
- Add your customs domains and subdomains to your hosts file
If you in OS X or Linux:
sudo vi /etc/hostsAnd add the following lines (you can change the domain name):
127.0.0.1 <your_domain>.com
127.0.0.1 db.<your_domain>.com
127.0.0.1 api.<your_domain>.com
127.0.0.1 admin.<your_domain>.comThis will make all your subdomains accesible from your local machine.
- Run the
install.jsscript:
chmod +x install.js./install.js-
Setup your WordPress, by default it's installed in:
http://admin.<your_domain>.com:5000- Input your language, user and email.
- Go to Settings > Permalinks and select Post name , otherwise the REST API won't work.
- Go to Plugins, select all the plugins and click select Activate action.
Once your configuration is up and running you can access to the different services:
- WordPress (WP Admin) -
http://admin.<your_domain>.com:5000/ - phpMyAdmin -
http://db.<your_domain>.com:5000 - NextJS -
http://<your_domain>.com:5000 - API -
http://api.<your_domain>.com:5000
[TODO]
This project uses Jest and Enzyme to provide a whole ready-to-use frontend testing setup.
All the test files can be found at frontend/__tests__ folder and they should be named *.spec.tsx.
To run them, use:
yarn testor if you want to use the watch mode, so you can run the tests after each code modification, use:
yarn test:watchHere is an example that can be found at frontend/__tests__/pages/index.spec.tsx:
import React from 'react';
import { shallow } from 'enzyme';
import { Index } from '../../pages/index';
import Container from '@material-ui/core/Container';
import Typography from '@material-ui/core/Typography';
import Layout from '../../src/components/Layout';
describe('Render index page correctly', () => {
let _component;
beforeEach(() => {
_component = shallow(<Index />);
});
afterEach(() => {
});
it('should render an index page with the correct layout components', () => {
expect(_component.find(Layout).length).toBe(1);
expect(_component.find(Container).length).toBe(1);
expect(_component.find(Typography).length).toBe(2);
});
});Add additional notes about how to deploy this on a live system
- NextJS - used by Netflix, Uber, InVision, Binance, GitHub, Docker or Auth0 among the companies that use this technology.
- WordPress - Most famous CMS, actually around 60% of the whole web pages use WordPress to provide content.
Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.
This project is licensed under the MIT License - see the LICENSE.md file for details
The main idea of this project is to be able to provide a simple boilerplate setup for new modern projects. The purpose is to provide freelancers a new way to work with WordPress, by using it just as a headless CMS, so they can focus on develop the application by themselves.