Create UWO App

A customizable framework built on top of create-react-app

Getting started

git clone https://github.com/uwosh/create-uwo-app.git
cd create-uwo-app
npm install
npm start

Get Started Immediately

You don’t need to install or configure tools like Webpack or Babel.
They are preconfigured and hidden so that you can focus on the code.

Just create a project, and you’re good to go.

Creating an App

You’ll need to have Node >= 6 on your local development machine (but it’s not required on the server). You can use nvm (macOS/Linux) or nvm-windows to easily switch Node versions between different projects.

It will create a directory called create-uwo-app inside the current folder.
Inside that directory, it will generate the initial project structure and install the transitive dependencies:

Editor Suggestions

Of course this project will work in any text editor, but we suggest using Visual Studio Code. We also suggest that you have the plugins ESLint and Prettier installed. We have also found the Debugger for Chrome to be very helpful. Configurations for each of these extensions and VS Code can be found in the .vscode folder.

Commands

npm start

Runs the app in development mode.
Open http://localhost:3000 to view it in the browser.

The page will automatically reload if you make changes to the code.
You will see the build errors and lint warnings in the console.

npm test

Runs the test watcher in an interactive mode.
By default, runs tests related to files changed since the last commit.

Read more about testing.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
By default, it also includes a service worker so that your app loads from local cache on future visits.

Structure

This app has preconfigured UWO branding, images, and components built in.

create-uwo-app
├── README.md
├── node_modules
├── package.json
├── .gitignore
├── public
│   ├── favicon.ico
│   ├── index.html
│   ├── manifest.json
│   └── icons
│       └── // all UWO icon sizes
└── src
    ├── App.css
    ├── App.js
    ├── App.test.js
    ├── index.css
    ├── index.js
    ├── logo.svg
    ├── registerServiceWorker.js
    └── components
        ├── Body
        │   ├── Body.css
        │   └── Body.js
        ├── Footer
        │   ├── FooterBottom
        │   │   ├── FooterBottom.css
        │   │   └── FooterBottom.js
        │   ├── FooterMain
        │   │   ├── Badges
        │   │   │   ├── images
        │   │   │   │   └── uw-system.png
        │   │   │   ├── Badges.css
        │   │   │   └── Badges.js
        │   │   ├── Location
        │   │   │   ├── images
        │   │   │   │   └── wismap-color.png
        │   │   │   ├── Location.css
        │   │   │   └── Location.js
        │   │   ├── QuickLinks
        │   │   │   ├── QuickLinks.css
        │   │   │   └── QuickLinks.js
        │   │   ├── Resources
        │   │   │   ├── Resources.css
        │   │   │   └── Resources.js
        │   │   ├── FooterMain.css
        │   │   └── FooterMain.js
        │   ├── Footer.css
        │   └── Footer.js
        └── Header