analytics/CONTRIBUTING.md

# Contributing

## Development setup

The easiest way to get up and running is to [install](https://docs.docker.com/get-docker/) and use Docker for running both Postgres and Clickhouse.

Make sure Docker, Elixir, Erlang and Node.js are all installed on your development machine.

### Start the environment:

1. Run both `make postgres` and `make clickhouse`.
2. You can then get set up with the following bits in one go with `make install`.
  1. Run `mix deps.get`. This will download the required Elixir dependencies.
  2. Run `mix ecto.create`. This will create the required databases in both Postgres and Clickhouse.
  3. Run `mix ecto.migrate` to build the database schema.
  4. Run `npm ci --prefix assets` to install the required node dependencies.
3. Run `make server` or `mix phx.server` to start the Phoenix server.
4. The system is now available on `localhost:8000`.

### Creating an account

1. Navigate to `http://localhost:8000/register` and fill in the form.
2. An e-mail won't actually be sent, but you can find the activation in the Phoenix logs in your terminal. Search for `%Bamboo.Email{assigns: %{link: "` and open the link listed.
3. Fill in the rest of the forms and for the domain use `dummy.site`
4. Run `make dummy_event` from the terminal to generate a fake pageview event for the dummy site.
5. You should now be all set!

### Stopping Docker containers

1. Stop and remove the Postgres container with `make postgres-stop`.
2. Stop and remove the Clickhouse container with `make clickhouse-stop`.

Volumes are preserved. You'll find that the Postgres and Clickhouse state are retained when you bring them up again the next time: no need to re-register and so on.

Note: Since we are deleting the containers, be careful when deleting volumes with `docker volume prune`. You might accidentally delete the database and would have to go through re-registration process.

### Pre-commit hooks

`pre-commit` requires Python to be available locally and covers JavaScript and CSS. Set up with `pip install --user pre-commit` followed by `pre-commit install`. Conversely, if the prompts are far too bothersome, remove with `pre-commit uninstall`.
task: Add CONTRIBUTING.md with development setup instructions (#395) * task: Add CONTRIBUTING.md with development setup instructions * Add --prefix assets to npm install instructions Co-authored-by: Dennis Tel <dennis@aiden.cx> 2020-11-05 14:43:24 +03:00			`# Contributing`

			`## Development setup`

			`The easiest way to get up and running is to [install](https://docs.docker.com/get-docker/) and use Docker for running both Postgres and Clickhouse.`

Update contribution guidelines (#403) * Update contribution guidelines to include dependency installation Now mentions the required system dependencies, and the step for installing Elixir deps Erlang is used by the :gettext dependency, and ecto.create will fail if it is not present * Make Clickhouse and PostgreSQL containers run in detached mode This ensures that they run in the background so that they are present during the follow steps 2020-11-10 11:58:49 +03:00			`Make sure Docker, Elixir, Erlang and Node.js are all installed on your development machine.`

task: Add CONTRIBUTING.md with development setup instructions (#395) * task: Add CONTRIBUTING.md with development setup instructions * Add --prefix assets to npm install instructions Co-authored-by: Dennis Tel <dennis@aiden.cx> 2020-11-05 14:43:24 +03:00			`### Start the environment:`

			1. Run both `make postgres` and `make clickhouse`.
Fix for details button misbehaving on mobile (#1114) * chore(make): convenience commands for installation & dev server * docs: easier development env instructions * docs: add note about docker volumes * docs: detail pre-commit configuration * style: eslint and prettier changes * Allow for passing custom classes to fade-in * style: eslint & prettier for the details button component * style: react lifecycle methods to come first * docs: add instructions to disable pre-commit * style: devices components * Move render methods to the last (together) in the order list * Remove unused component import * React lifecycle to come first before our own methods * General styling and eslint changes * Cleaner renderContent method using switch/case (fixes an eslint error as well!) * Cleaner renderPill method with proper spacing + removing uncessary else * style: more eslint/prettier for pages components * Use newer Fragment syntax * Remove unnecessary else statement * Use backtick strings for concatenating strings * Remove unnecessary space * Remove unused imports and variable declarations * Bunch render methods together as last in the order list * fix: details button to drop to the bottom naturally on smaller screens This _mostly_ fixes one of the issues being tracked on #972, titled "Details button issue on Firefox specifically" * refactor: reduce usage of our CSS class in favor of tailwind's util classes * refactor: remove our css classes in favor of Tailwind's util classes 2021-06-15 10:34:43 +03:00			2. You can then get set up with the following bits in one go with `make install`.
			1. Run `mix deps.get`. This will download the required Elixir dependencies.
			2. Run `mix ecto.create`. This will create the required databases in both Postgres and Clickhouse.
			3. Run `mix ecto.migrate` to build the database schema.
			4. Run `npm ci --prefix assets` to install the required node dependencies.
			3. Run `make server` or `mix phx.server` to start the Phoenix server.
			4. The system is now available on `localhost:8000`.
task: Add CONTRIBUTING.md with development setup instructions (#395) * task: Add CONTRIBUTING.md with development setup instructions * Add --prefix assets to npm install instructions Co-authored-by: Dennis Tel <dennis@aiden.cx> 2020-11-05 14:43:24 +03:00
			`### Creating an account`

			1. Navigate to `http://localhost:8000/register` and fill in the form.
			2. An e-mail won't actually be sent, but you can find the activation in the Phoenix logs in your terminal. Search for `%Bamboo.Email{assigns: %{link: "` and open the link listed.
			3. Fill in the rest of the forms and for the domain use `dummy.site`
			4. Run `make dummy_event` from the terminal to generate a fake pageview event for the dummy site.
			`5. You should now be all set!`
chore(docker): improve repeat contributions workflow (#1057) * This change adds two new commands to gracefully stop and remove the Postgres and Clickhouse docker containers. To do so, it also gives them a recognizable name. * Additionally, the Postgres container is updated to use a named volume for its data. This lower friction for repeat contributions where one would otherwise sign up and activate their accounts again and again each time. 2021-05-19 16:49:39 +03:00
			`### Stopping Docker containers`

			1. Stop and remove the Postgres container with `make postgres-stop`.
			2. Stop and remove the Clickhouse container with `make clickhouse-stop`.

Fix for details button misbehaving on mobile (#1114) * chore(make): convenience commands for installation & dev server * docs: easier development env instructions * docs: add note about docker volumes * docs: detail pre-commit configuration * style: eslint and prettier changes * Allow for passing custom classes to fade-in * style: eslint & prettier for the details button component * style: react lifecycle methods to come first * docs: add instructions to disable pre-commit * style: devices components * Move render methods to the last (together) in the order list * Remove unused component import * React lifecycle to come first before our own methods * General styling and eslint changes * Cleaner renderContent method using switch/case (fixes an eslint error as well!) * Cleaner renderPill method with proper spacing + removing uncessary else * style: more eslint/prettier for pages components * Use newer Fragment syntax * Remove unnecessary else statement * Use backtick strings for concatenating strings * Remove unnecessary space * Remove unused imports and variable declarations * Bunch render methods together as last in the order list * fix: details button to drop to the bottom naturally on smaller screens This _mostly_ fixes one of the issues being tracked on #972, titled "Details button issue on Firefox specifically" * refactor: reduce usage of our CSS class in favor of tailwind's util classes * refactor: remove our css classes in favor of Tailwind's util classes 2021-06-15 10:34:43 +03:00			`Volumes are preserved. You'll find that the Postgres and Clickhouse state are retained when you bring them up again the next time: no need to re-register and so on.`

			Note: Since we are deleting the containers, be careful when deleting volumes with `docker volume prune`. You might accidentally delete the database and would have to go through re-registration process.

			`### Pre-commit hooks`

			`pre-commit` requires Python to be available locally and covers JavaScript and CSS. Set up with `pip install --user pre-commit` followed by `pre-commit install`. Conversely, if the prompts are far too bothersome, remove with `pre-commit uninstall`.