Am I Rent Stabilized?

A mobile friendly, multi-lingual web app that informs NYC residents about Rent Stabilization by simplifying the process of how to find out if their apartment may be rent stabilized, if they are paying too much rent, and what to do about it.

See it in action at amirentstabilized.com.

Develop

Requires familiarity with the Command Line Interface, as well as installations of NodeJS v16.13.2 and Yarn ~v1.22.

Note it is recommended to use Node Version Manager (nvm) to switch between different NodeJS versions in a shell.

Available Scripts

Note that the following commands assume to be run from the ./app directory.

First be sure to install the required 3rd party dependencies:

yarn install

To start have Webpack watch for changes and serve the site using Webpack Dev Server:

yarn start

To create a production optimized build (will output assets to the app/dist directory):

yarn prod

To run the tests in watch mode (highly recommended during development!):

yarn test:watch

To debug Webpack build issues, create a "debug" build by doing:

yarn webpack:debug

To serve the assets of the production build do:

yarn start:prod

Other

The handlebars-loader Webpack loader handles the .hbs file extension so Webpack won't complain. It will automatically look for any Handlebars partials in app/src/hbs_partials and helpers in app/src/hbs_helpers.

Note that any newly added Handlebars partials will need to be registered with Jest in order for the unit tests not to break. See src/setupJest.js for how this is done.

Updating the Site's Content:

The app uses Handlebars.JS for translating content between three supported languages: English, Spanish, and Chinese. Any changes made to any of the written content in any of the HTML pages will need to be reflected in the corresponding locales JSON and potentially the Handlebars template files.

These files are located as follows:

• app/public/locales: JSON files for locales. The naming convention used is [page name]-[language code].json.
• app/src/hbs_templates: Handlebars template files that correspond to the websites HTML pages

Note that in both sets of files main maps to index.html

Additionally, all supported languages are specified in app/src/constants/locales.js.

Adding a New Translation

Adding a new language translation will require:

1. New locale JSON files for each corresponding HTML page
2. Updating the constants LANG and IN_LANG in app/src/constants/locales.js
3. Updating the UI to display the new language option. The corresponding UI files are:
   • The Handlebars language_toggle partial
   • The Components languageToggle.js and languageToggleButton.js in app/src/components.

If many languages are to be supported in the future, then a dropdown / select menu may be more appropriate than individual language toggle buttons.

Note that currently "right to left" languages are not supported in the UI.

Data Sources and Processing:

See the data/ directory for a Makefile and Docker container configurations for generating the app's data.

The processed data is hosted and publicly available for download on CARTO.

Credits

• Big thanks to Caroline Woolard for suggesting the idea to me.

• Jue Yang designed the awesome building graphics which informed the overall redesign of version 2 of the site.

• Eric Brelsford and BetaNYC provided motivational and technical support.

• Radish Lab contributed the design mockups for version 2.

• John Krauss provided data for NYC properties that should have rent-stabilized apartments due to receiving tax exemptions from state programs such as 421a. (You can learn more on the the repo for nyc-stabilization-unit-counts).

Fullscreen Slides with GSAP's TweenLite, CSSPlugin and ScrollToPlugin Credit

Forked from Chrysto's Pen Fullscreen slides with TweenLite, CSSPlugin and ScrollToPlugin.

A Pen by Captain Anonymous on CodePen.

License.

LICENSE

Creative Commons Attribution-NonCommercial (CC BY-NC)

In other words: Not For Profit!