noelworden / atlas

Angling Atlas

Atlas

A sandboxing Elixir/Phoenix app built around a growing database of my favorite places in Colorado

https://www.theanglingatlas.com

---

Spinning up project with Docker

• Install Docker for Mac
• In one terminal tab:
  • docker-compose build
  • docker-compose up
• In a second tab, once the two commands in the first tab are completed:
  • docker-compose exec web mix ecto.setup
• If everything spins up with no errors, site will be live at localhost:4000

---

Run seeds

• The seeds.exs file is executed in the ecto.setup mix command, in the steps above
• If the seeds need to be run again, it can be done with the following command:
  • docker-compose exec web mix run priv/repo/seeds.exs

---

run vs exec

When executing a command with docker-compose it can be run with either run or exec.

From the docs:

• The docker run command first creates a writeable container layer over the specified image, and then starts it using the specified command
  • If using run, adding the --rm flag will automatically remove the container when the command is finished
• The docker exec command runs a new command in a running container

References: https://docs.docker.com/engine/reference/commandline/run/ https://docs.docker.com/engine/reference/commandline/exec/

---

Debugging

With the project running on Docker, the standard iex -S mix will not work to spin up an iEX console. An updated command, that works with Docker is:

docker-compose exec web iex -S mix

This command will maintain history from one iEX shell to another:

docker-compose exec web iex --erl "-kernel shell_history enabled" -S mix

---

Testing

With the project running on Docker tests can be run with:

docker-compose exec web mix test

To run only a specific test file:

docker-compose exec web mix test test/<path to file>

To run only a specific test within a test file:

docker-compose exec web mix test test/<path to file>:<test line number>

---

Deploying to staging

Hosted by Gigalixir, docs can be found here

• It should be noted that the docs are very good, and searchable
• Once the CLI is installed, gigalixir help is also very detailed

Project URL

• https://atlas.gigalixirapp.com/

Install Gigalixir CLI (with homebrew)

• brew tap gigalixir/brew && brew install gigalixir

Log into Gigalixir

• gigalixir login

Verify login was successful

• gigalixir account

Setup git remote

• Navigate to project folder
• gigalixir git:remote atlas

Confirm remote

• git remote -v

If desired, rename remote (which defaulted to gigalixir) to staging

• git remote rename gigalixir staging

Push to staging

• Any branch can be pushed to the staging site
• Branches need to be pushed to Github before being pushed to staging
  • git push staging <branch name>:master

Main vs Master

• This project's main branch is named main, but Gigalixir is expecting it to be named master
  • Because of this, when pushing main to staging, it cannot be done with the shorthand: git push staging master
  • Until a fix is made by Gigalixir, the following syntax must be used to push: git push staging main:master

---

Executing mix Commands in Staging

The app is currently setup to be able to run mix commands on the staging environment

The run command

• This can be used to run a shell command as a job in a separate container
• gigalixir run ...

Using run and mix

• Any mix command available locally can be executing on staging utilizing run
• gigalixir run mix <command here>

Executing a migration

• gigalixir run mix ecto.migrate
• The logs do not automatically show, to view the logs
  • gigalixir logs

Seeding the database

• gigalixir run -- mix run priv/repo/seeds.exs

Run IEx in remote app

• gigalixir ps:remote_console

---

Viewing the app

To open the app in a browser

• gigalixir open

SSL Troubleshooting

• 20210901 renewed the name.com domain and then the SSL (https) was not available
• The fix
  • delete and reset the www domain
  • removed the domain via the dashboard
  • gigalixir domains:add www.theanglingatlas.com
  • the www domain points to theanglingatlas.com as a CNAME via name.com

atlas's Issues

Refactor Context Test

Create initial records, then update records as needed per test case

Add `export to map` feature

• Show as map at the top of destinations (index) page.
• Example of multiple points and Open Layers:
  https://openlayers.org/en/latest/examples/regularshape.html

open street view?
google maps?
other open source maps?

Configure CI tool for repo

https://hashrocket.com/blog/posts/build-the-ultimate-elixir-ci-with-github-actions

Establish hosting services

• start by looking at this doc -> https://hexdocs.pm/phoenix/deployment.html
• Gugalixir specific -> https://hexdocs.pm/phoenix/gigalixir.html
• Gigalixir screencast
  • docs
• possibly heroku?
• another blog for heroku
• aws? (see bookmarked dev.to article)
• other service options

Automatically deploy to Gigalixir

Is a 'nice-to-have', idea came from the following post:
https://www.mitchellhanberg.com/ci-cd-with-phoenix-github-actions-and-gigalixir/

Update README

Add camp filtering functionality

Add hike filtering functionality

Incorporate ability to export results to Google Maps

• possibly incorporate the Google Map into the view?

• https://coletiv.com/blog/how-to-use-google-maps-phoenix-live-view/

• possibly use open maps (better open source)?

Update Blue Lake in CSV

Not available for ice fishing/winter

Add to description that its not plowed in the winter

Alter three distance fields to be one field with a relational databsae

for example: if less_than_one == true, other 2 must be false

Create `destination` Module

Fields based on existing Google Sheets column

longitude -> decimal
latitude -> decimal
name -> string
description > string(?)
icon -> integer
spinner_friendly -> boolean
lake -> boolean
less_than_one_hour -> boolean
one_to_three_hours -> boolean
greater_than_three hours -> boolean
car_friendly -> boolean
hike_in -> boolean
allows_dogs -> boolean
dogs_off_leash -> boolean
season_spring -> boolean
season_summer -> boolean
season_fall -> boolean
season_winter -> boolean
car_camp -> boolean
backpack_camp -> boolean
fee -> boolean
ice_fishing -> boolean

Rewrite `destination` CRUD vews using Tailwinds CSS

Create seeds for `destination` module

Update user flow through Destinations

Site Index Page:

• Start with 6x buttons, to send user to that season's destinations (including ice fishing), and an "all destinations" option
• have button for creating new destination
  Seasonal Destination Page:
  • drop the season / ice fishing from the index table
• drop the description from the index table (can be viewed in show page)
• have one column showing which time option is true
• drop the lat/long

Remove unused depedencies

Update old dependencies

mix hex.outdated

https://binarynoggin.com/tips-and-tricks-for-keeping-elixir-projects-up-to-date/

Incorporate Auth and Users

Add camp filtering functionality

Create tests for `destinations` Module

Setup Docker

[] first attempt at the process: https://pspdfkit.com/blog/2018/how-to-run-your-phoenix-application-with-docker/
bitwalker documentation: https://hub.docker.com/r/bitwalker/alpine-elixir-phoenix/

didnt see anywhere in the docs that the hostname needed to be updated in dev.exs
look at this link for .dockerignore file additions: https://hexdocs.pm/distillery/guides/working_with_docker.html

iex can be accessed with docker-compose exec web iex --erl "-kernel shell_history enabled" -S mix with docker

• docker-compose build

• docker-compose run --rm mix ecto.create

• docker-compose up

• will be updating when there are migrations to be run

• look into this article for yml content: https://medium.com/swlh/use-docker-to-create-an-elixir-phoenix-development-environment-e1a81def1d2e

• add .dockerignore

  • https://hexdocs.pm/distillery/guides/working_with_docker.html
  • https://hub.docker.com/r/bitwalker/alpine-elixir-phoenix/

• volumes in yml file

• [] create docker-compose.sample.yml

  • skipping until it is necessary bc of different, non-mac developing environments

• [] add actual docker-compose.yml to .gitignore

  • skipping until it is necessary bc of different, non-mac developing environments

• [] add note in README about new command to spin up iEX console

• [] edit db config so its not defaults?

  • keeping as defaults because it is only for the dev environment, staging and prod will have non-generic db specs

• confirm CI is using same version of elixir and otp as docker container

Confirm basic app runs locally

• Needed to start local PostgreSQL, since it hadnt been utilized in the previous, Dockerized project

Create tests for `destination_view.ex`

Consider updating `lake` field to a relational database

Example: stream, river, lake, tailwater

Add dog filtering functionality

Create multi-field filtering feature

[] with existing index or in a new view?
[] start with lake field
[] commit per filter field
[] adjust title of the index page
[] adjust main page to make filtering the hero
[] have link for see all
[] NEW TICKET to search within see all index

Create seed file

Create CRUD functionality for `destinations` Module

Alter distance calculation

One option:

• Shift distance data from 3 columns to a decimal in one column. Then can perform more accurate logic when querying.

Second option:

• Bring in gps library and start 'live calculating'

Set Gigalixir environments to custom domains

Add map to `destination/show`

Look into Open Street Maps services

• Incorporate a working map into the show page
• Create standalone JS file, instead of <script> tags in the html
  • import only necessary aspects of ol.js

Move PR template to `.github` directory

Im thinking that its more appropriate to be in .github than it is in docs

Create `destination` CRUD pages in `.eex`

Possible approach to has many for seasons

https://sisccr.medium.com/many-to-many-checkbox-phoenix-1-5-f476b4235c9b

Create wireframe of `destination` CRUD pages

Create dynamic distance calculator

• user sets home
• when sorting, user sets distance
• math logic is done on the fly

Look into updating fields as Enums

https://dennisbeatty.com/use-the-new-enum-type-in-ecto-3-5.html

Water type. distance, dogs

Alter season tracking

Another potential option:

• give each location a set of numbers (1-12) that correspond to when the fishing is good. Potentially as a relational database

Create link to google maps as 'get directions' on `destinations/show` page

This is a temporary solution for this feature

Update NimbleCSV to 1.1.0

Check for changelogs to see what changed from v 0.7

Setup iEX dotfile

Add vehicle filtering functionality

Update `destination/delete` redirect

It is currently redirecting to /

Needs to redirect back to the filtered index that it was deleted from

Add fee filtering functionality

Make CI Faster

Seems like Credo is a bit slow, the first blog post used to setup the CI yml spoke of caching, should look into it more to see if it would speed up Credo

• https://hashrocket.com/blog/posts/build-the-ultimate-elixir-ci-with-github-actions#setting-up-mix-dependency-cache

Incorporate a11y into the `destination` CRUD pages

Look into benefits of Phoenix Live Reload