An application skeleton for creating applications with CakePHP 5.x, typescript and react.
- Ensure you have nodejs installed.
- Download Composer or update
composer self-update
. - Run
php composer.phar create-project --prefer-dist markstory/cakephp-typescript-react [app_name]
. - Install nodejs dependencies with
npm install
oryarn install
.
Unlike typical CakePHP applications, the frontend assets in this skeleton live
in assets
. In this directory you'll find directories for the
SASS and Typescript files
your application will use. These source files are compiled into assets stored in
webroot
via webpack.
This skeleton uses Laravel Mix(via AssetMix plugin) as a high-level wrapper around webpack to build the typescript/react & sass assets. For local development you'll generally want to run webpack in 'watch' mode:
npm run watch
In watch mode, webpack will watch the filesystem for changes and recompile as necessary. Source maps will be available in watch mode.
When it comes time to deploy your application to production you should use:
npm run prod
The above will generate minified assets and not generate sourcemaps. Ideally the above command is generated during your deploy process, or when you build the artifacts you are going to deploy.
This application skeleton includes setup for PHPUnit to do serverside testing & jest + testing-library/react to do frontend tests.
You can run PHPUnit with:
composer test
And jest with:
npm run test
You can run the local PHP server with:
bin/cake server
And then visit this server at http://localhost:8765
. Using another webserver
is possible, but you will need to further configure mix
to know about the subdirectory
your application is running in. If you have built the frontend using webpack you
can view http://localhost:8765/pages/greet
to see a the result of a PHP template
that also renders react components.