NewSpring / Holtzman

The main NewSpring namespace and utilities for all newspring packages.

Holtzman

Holtzman is an application framework for building high speed, web + native, reactive applications. It is built using Reactjs, Redux, and Meteor. This repository contains the application framework and instructions for usage.

Table of Contents

Prerequisites

Quick Start

Structure

Local Development

• Testing
• Linting
• Typing

Deploys

Contributing

Prerequisites

• Meteor: curl https://install.meteor.com/ | sh;

• Install Node via NVM. Latest stable: 8.4.0+

• On Mac run xcode-select --install to install command line tools.

• Install Yarn via your preferred method. We use Homebrew. Latest stable version can be found here.

• *Xcode for iOS.

• *Cocoapods for iOS.

• *Android Dev Tools instructions for Android.

  * optional unless you want to build natively

Quick Start

$ git clone [e-mail]:NewSpring/Holtzman.git
$ cd Holtzmann
& yarn install
$ cp ./.meteor/sample.settings.json ./.meteor/settings.json
$ WEB=true meteor run --settings ./.meteor/settings.json

You may need some additional parameters for your meteor settings file.

Structure

This repo contains the code base used to build v5 of the NewSpring site and native app. Our sites and native apps share much of the same functionality, and therefore share the same code.

• /assets: additional assets that don't need to be loaded over a web server
• /client: entry point for client
• /imports: basically all code, client and server
• /public: static assets to be loaded from web server
• /.dev: command line scripts used for deployment, testing, etc
• /server: entry point for server
• /stylesheets: sass for generating our css using sass and junction
• */__tests__: tests adjacent to the module they are testing
• */__stories__: react storybook stories adjacent to the module they are displaying
• */__mocks__: module mocks for testing adjacent to the module they mock.
• main.html: root HTML file
• mobile-config.js: used to generate cordova apps
• package.json: used to manage yarn dependencies and etc.
• yarn.lock: used to make sure all developers are using the same package versions

Imports directory

/imports/ contains all of the working files for Holtzman. Inside are the following directories:

• /components: React components and higher-ordered components.
• /data: all data manipulation methods and utilities.
• /deprecated: old files that are to be removed. Nothing new should be added here.
• /pages: app pages
• /util: additional helper functions

Local Development

Basics

To install all dependencies, we use Yarn. To get started:

1. Clone down the repo
2. Make sure you have the Yarn CLI installed
3. Run yarn.

Use the meteor run command. It may be helpful to alias the command in your command line for quick startups.

Holtzman uses environment variables to control certain aspects of building. Setting these variables will cause either the web version or the mobile version to build.

$ WEB=true $ NATIVE=true

you can leave these off instead of setting them to false. Its not recommended to set these using export. Instead you can add them to the command like this:

• WEB=true meteor run --settings ./.meteor/settings.json
• NATIVE=true meteor run ios-device --settings ./.meteor/settings.json

Building

The build done for production on web is this:

NODE_ENV="production" WEB=true meteor build .build --architecture os.linux.x86_64 --server https://my.newspring.cc --mobile-settings ./.meteor/settings.json

The build for native is this:

NODE_ENV="production" NATIVE=true meteor build .build --architecture os.linux.x86_64 --server https://native.newspring.cc --mobile-settings ./.meteor/settings.json

• all builds are done from the project root.

Testing

This project uses Jest for unit tests. These tests are located in __tests__ subfolders adjacent to the thing they're testing.

To run tests, call yarn test or yarn test -- --watch. This will also run eslint and flow tests when complete.

Linting

This project includes linting using ESLint. To manually run eslint, use yarn lint. There are tools available for many editors to show you errors while you work. Its recommended to use one of these tools and enable the option to use project based eslint which will use the eslint thats installed with yarn.

Typing

This project contains static typing for some of our code. We use Flow for this. To enable flow to a file, add // @flow to the very top of the file.

To run flow, use yarn flow.

CI and Deploys

This project is automatically tested on Jenkins CI. It is tested on every branch push as well as every PR. If a PR is open, then pushes to the branch being requested also get tested.

• For authenticated users, detailed test results can be see in the Jenkins Control Panel
• Test results can also be seen under the branches tab in GitHub

This project can be deployed by Jenkins through its web UI. We have 2 different versions of the application: web and native. We also have 2 different environments to deploy to: beta and production. Currently, only the web platform can be deployed through Jenkins. Native builds currently are manually run and submitted.

Deploy Process

This details how administrators to the repository with admin access inside Jenkins can deploy the project to all of our platforms.

• Tests are run for all pull requests.
  • Passing tests for pull requests generate a GitHub tag in the format:
    GH<GitHub PR Number>-B<Jenkins Build number>
• Building For Web
  • Open the Holtzman-Web project in Jenkins.
  • Click Build with Parameters on the sidebar.
  • Choose the environment (beta or production)
  • Choose the tag you wish to deploy
  • Click Build

Contributing

For more information about contributing PRs and issues, see our Contribution Guidelines.

Good First PR is a great starting point for people new to this project.