Initial commit

Author: msj

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,23 @@
+## Overview
+
+Brief description of what this PR does, and why it is needed.
+
+Closes #XXX
+
+- [ ] Includes a test
+
+### Demo
+
+Optional. Screenshots, `curl` examples, etc.
+
+### Notes
+
+Optional. Ancillary topics, caveats, alternative strategies that didn't work out, anything else.
+
+## Testing Instructions
+
+- How to test this PR
+- Prefer bulleted description
+- Start after checking out this branch
+- Include any setup required, such as bundling scripts, restarting services, etc.
+- Include test case, and expected output

.github/workflows/main.yml

@@ -0,0 +1,22 @@
+name: Run tests
+
+on:
+  push:
+    branches:
+      - main
+      - deploy
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  test:
+    name: Run tests
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - name: Run tests
+        run: |
+          docker compose -f docker-compose.yml \
+            -f tests/docker-compose.yml \
+            run --rm app

.gitignore

@@ -0,0 +1,119 @@
+.DS_Store
+
+webpack-stats.json
+
+out.txt
+/data/final/*.csv
+/data/shapefiles/*
+/data/intermediate/*.sql
+
+# Byte-compiled / optimized / DLL files
+__pycache__/
+*.py[cod]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+MANIFEST
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*.cover
+.hypothesis/
+.pytest_cache/
+
+# Translations
+*.pot
+
+# Django stuff:
+*.log
+local_settings.py
+db.sqlite3
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+
+# PyBuilder
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# pyenv
+.python-version
+
+# celery beat schedule file
+celerybeat-schedule
+
+# SageMath parsed files
+*.sage.py
+
+# Environments
+.env
+.venv
+env/
+venv/
+ENV/
+env.bak/
+venv.bak/
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
+
+# mypy
+.mypy_cache/
+
+# Compiled JavaScript
+node_modules/
+map/static/compressor/*
+!map/static/js/lib/
+
+# Local uploads
+media/

Dockerfile

@@ -0,0 +1,33 @@
+FROM node:25-slim AS node
+
+# Inside the container, create an app directory and switch into it
+RUN mkdir /app
+WORKDIR /app
+
+COPY ./package.json package.json
+RUN npm install
+
+FROM python:3.14.3 AS app
+
+LABEL maintainer "DataMade <info@datamade.us>"
+
+RUN apt-get update && \
+	apt-get install -y --no-install-recommends --purge postgresql-client gdal-bin && \
+	apt-get autoclean && \
+	rm -rf /var/lib/apt/lists/* && \
+	rm -rf /tmp/*
+
+RUN mkdir /app
+WORKDIR /app
+
+COPY ./requirements.txt /app/requirements.txt
+RUN pip install --no-cache-dir -r requirements.txt
+
+# Get NodeJS & npm
+COPY --from=node /usr/local/bin /usr/local/bin
+COPY --from=node /usr/local/lib/node_modules /usr/local/lib/node_modules
+
+# Get app dependencies
+COPY --from=node /app/node_modules /app/node_modules
+
+COPY . /app

Makefile

@@ -0,0 +1,20 @@
+.PHONY: all
+all: load_community_areas load_data
+
+.PHONY: clean
+clean:
+	rm data/raw/chicago-restaurants.csv data/raw/community-areas.geojson
+
+.PHONY: load_community_areas
+load_community_areas: data/raw/community-areas.geojson
+	python manage.py load_community_areas $^
+
+.PHONY: load_data
+load_data: data/raw/chicago-restaurants.csv
+	python manage.py load_restaurant_permits $^
+
+data/raw/chicago-restaurants.csv:
+	curl "https://data.cityofchicago.org/api/v3/views/fr9j-f3pa/query.csv?query=SELECT%0A%20%20%60id%60%2C%0A%20%20%60permit_%60%2C%0A%20%20%60permit_type%60%2C%0A%20%20%60review_type%60%2C%0A%20%20%60application_start_date%60%2C%0A%20%20%60issue_date%60%2C%0A%20%20%60processing_time%60%2C%0A%20%20%60street_number%60%2C%0A%20%20%60street_direction%60%2C%0A%20%20%60street_name%60%2C%0A%20%20%60work_description%60%2C%0A%20%20%60building_fee_paid%60%2C%0A%20%20%60zoning_fee_paid%60%2C%0A%20%20%60other_fee_paid%60%2C%0A%20%20%60subtotal_paid%60%2C%0A%20%20%60building_fee_unpaid%60%2C%0A%20%20%60zoning_fee_unpaid%60%2C%0A%20%20%60other_fee_unpaid%60%2C%0A%20%20%60subtotal_unpaid%60%2C%0A%20%20%60building_fee_waived%60%2C%0A%20%20%60zoning_fee_waived%60%2C%0A%20%20%60other_fee_waived%60%2C%0A%20%20%60subtotal_waived%60%2C%0A%20%20%60total_fee%60%2C%0A%20%20%60reported_cost%60%2C%0A%20%20%60community_area%60%2C%0A%20%20%60census_tract%60%2C%0A%20%20%60ward%60%2C%0A%20%20%60latitude%60%2C%0A%20%20%60longitude%60%2C%0A%20%20%60location%60%0AWHERE%0A%20%20%60issue_date%60%0A%20%20%20%20BETWEEN%20%222016-01-01T00%3A00%3A00%22%20%3A%3A%20floating_timestamp%0A%20%20%20%20AND%20%222026-03-09T00%3A00%3A00%22%20%3A%3A%20floating_timestamp&app_token=$$CDP_APP_TOKEN" -o $@
+
+data/raw/community-areas.geojson:
+	curl https://data.cityofchicago.org/resource/igwz-8jzy.geojson -o $@

README.md

@@ -0,0 +1,92 @@
+# DataMade Code Challenge: React Map
+
+![2026 DataMade Code Challenge](https://github.com/datamade/code-challenge-v2/blob/main/map/static/images/2026-datamade-code-challenge.jpg)
+
+Welcome to the 2026 DataMade code challenge! 👋
+
+## Overview
+
+Your task is to complete the following programming exercise to show us some of your code! This exercise is based on work that DataMade does every day: pulling data from the web, debugging tricky code, and presenting information to the world.
+
+Submissions should be submitted as a pull request against your fork of this original repository. **Make sure to make your pull request against your own fork of the repository, not the original DataMade repository**.
+
+There’s no time limit, but don’t feel the need to go over the top with your submission. We expect this task to take about two hours to complete, but it could take more or less time depending on your familiarity with Django and React. When you’re all set, share your code with us as a repository on GitHub.
+
+We’ll be evaluating whether the code works, as well as its quality. Before submitting, make sure that your code does what you expect it to do, that it’s clean and neat enough to meet your standards, and that you’ve provided us some instructions on how to run it.
+
+## Installation
+
+Development requires a local installation of [Docker](https://docs.docker.com/get-started/get-docker/) and [Docker Compose](https://docs.docker.com/compose/install/). These are the only two system-level dependencies you should need.
+
+Once you have Docker and Docker Compose installed, build the application containers from the project's root directory:
+
+```bash
+docker compose build
+```
+
+Load in the data:
+
+```bash
+docker compose run --rm app python manage.py loaddata map/fixtures/restaurant_permits.json map/fixtures/community_areas.json
+```
+
+And finally, run the app:
+
+```bash
+docker compose up
+```
+
+The app will log to the console, and you should be able to visit it at http://localhost:8000
+
+## Completing the Challenge
+
+Once you have the app up and running on your computer, you'll need to flesh out certain code blocks to make the map functional. You'll be using [Django](https://docs.djangoproject.com/en/6.0/) and [React-Leaflet](https://react-leaflet.js.org/docs/api-components/) to complete this task. By the end of this challenge, you should have:
+
+- a map that displays Chicago's community areas, shaded depending on how many new restaurant permits were issued in a given year
+- community area shapes that show some light details on that community area when a user interacts with them
+- a filter that allows users to request permits that were issued in a given year
+- UI components that display the total number of permits and max number of permits in one community area for that year
+
+This way you go about completing these goals is meant to be open-ended, so tackle the following steps in whatever way you're most comfortable!
+
+### Step 1: Supplement the community area geojson data
+
+In `map/serializers.py`, supplement each community area with data on the amount of permits issued in each area during the currently filtered year. From here, the view will pass that data to the front end.
+
+### Step 2: Write a test for your data endpoint
+
+In `tests/test_views.py` implement a test to validate the data that your endpoint produces. You will want to create some test `CommunityArea` and `RestaurantPermit` objects and then assert that the expected values are returned when querying the endpoint.
+
+Use this command to run tests:
+
+```bash
+ docker compose -f docker-compose.yml -f tests/docker-compose.yml run --rm app
+```
+
+### Step 3: Filter results by a specific year
+
+In `map/static/js/RestaurantPermitMap.js`, create a filter that allows users to send a request for a specific year to the backend. The options shoulds be any year between 2016 and 2026, inclusive. Then, use the fetch api in the map component to make a request and receive that data.
+
+### Step 4: Display results on the page
+
+In the map component, process the community area and use it to display shapes for all areas on the map. Then, display the total number of restaurant permits that year as well as the maximum number of permits in any one area.
+
+### Step 5: Make the map dynamic
+
+Start displaying some data! Use the `setAreaInteraction()` method to shade the map according to how many permits it has in a year, making sure that it updates automatically when a new year is selected. In this same method, have each area display a popup during some kind of user interaction. The popup should have some light details to help the user understand what they're looking at.
+
+### Step 6: Submit your work
+
+To submit your work, create a feature branch for your code, commit your changes, push your commits up to your fork, and open up a pull request against main. Finally, drop a link to your pull request in your application.
+
+_Note: If you would prefer to keep your code challenge private, please share access with the following members of DataMade on GitHub:_
+
+| Member    | GitHub Account                   |
+| --------- | -------------------------------- |
+| Hannah    | https://github.com/hancush       |
+| Derek     | https://github.com/derekeder     |
+| Monkruman | https://github.com/antidipyramid |
+| Xavier    | https://github.com/xmedr         |
+| Hayley    | https://github.com/haowens       |
+
+Keep in mind that you cannot create a private fork of a public repository on GitHub, so you’ll need to [follow these instructions](https://gist.github.com/0xjac/85097472043b697ab57ba1b1c7530274) to create a private copy of the repo.

app.json

@@ -0,0 +1,34 @@
+{
+  "name": "map",
+  "scripts": {},
+  "env": {
+    "DJANGO_ALLOWED_HOSTS": {
+      "required": true
+    },
+    "DJANGO_SECRET_KEY": {
+      "required": true
+    },
+    "AWS_ACCESS_KEY_ID": {
+      "required": true
+    },
+    "AWS_SECRET_ACCESS_KEY": {
+      "required": true
+    },
+    "AWS_STORAGE_BUCKET_NAME": {
+      "required": true
+    }
+  },
+  "formation": {
+    "web": {
+      "quantity": 1,
+      "size": "basic"
+    }
+  },
+  "environments": {
+    "review": {
+      "addons": ["heroku-postgresql:mini"]
+    }
+  },
+  "buildpacks": [],
+  "stack": "container"
+}