Streisand Frontend Project Build with React and TypeScript
488
The web front-end code for JumpCut code named Phoenix for development purposes.
The site is built with webpack. We are using Typescript to make collaboration and maintenance easier. The UI is built on top of the React framework using Redux as our state container.
This project uses yarn as its package/dependency manager. So after
cloning the project, you will want to install the current version of
node. Depending on your OS, please see here on
installing Yarn: Yarn. Once
you have it installed you can run yarn in the project's root directory
to install the project's dependencies.
We have npm scripts set up for dev loop builds and prod builds. Before
you start, make sure and copy the env.template in the root of the
frontend folder as .env. For the development build run the command:
yarn run dev. Babel is needed for the webpack development build
because the hmr requires it for some reason
(react-hot-loader).
By default, the code is setup for developing. The project adds several
helpful debugging tools including a development server that supports
module hot loading. If you run yarn run start it will do an initial
development build and startup up the web server opening app in your
browser (http://localhost:3000). You will then be able to make changes
to the code and the server will run incremental builds and update the
site (usually) without you having to refresh the page.
The following are links to various internal documentation pages that should be useful references while working on this project. - [API Core Schema <https://api.pinigseu.xyz/api/v1/schema/>]{.title-ref}__ - [API Swagger Schema documentation <https://api.pinigseu.xyz/api/v1/swagger/>]{.title-ref}__ - [API Redoc Schema documentation <https://api.pinigseu.xyz/api/v1/redoc/>]{.title-ref}__
In order to get the production ready files, all you need to do is run
the default npm script command: yarn run build. This will remove any
remnants of a previous build and then build the project without any of
the development tools. It will then compress and uglify everything into
a handful of files. All built files will be dumped in the '/dist'
directory.
None of the APIs that this site is using are setup to work with
localhost requests. Until they support CORS you will need to route all
API traffic through a proxy. There is a proxy.js file in the root of the
project for doing this. - Run node .\proxy.js "https://api.url.com" to
start the proxy server for the site api.
Content type
Image
Digest
Size
34.8 MB
Last updated
about 8 years ago
docker pull streisandjumpcut/streisand-react