Digital goods shop & blog created using Phoenix Framework (Elixir)
This is the source code for my new website - Authentic Pixels. Through Authentic Pixels, I plan to deliver high quality free & premium web resources including Bootstrap HTML templates, startup landing pages, UI kits, mockups & themes for Ghost & Wordpress.
Demo & Screenshots
View the live website here - Authentic Pixels
Here are some screenshots of the admin area.
This project has been a great learning experience for me. Coming from Ruby on Rails, there are a lot of things that are done differently in Elixir/Phoenix and building this app has helped me understand the "Elixir way" of doing things.
Some of the things that this project helped me wrap my head around are -
- Nested records & associations (e.g: Product has many variants)
- Handling many-to-many associations and validating them
- Uploading images
- Switching to Webpack from Brunch
- Creating Sitemaps and running a cron task to regularly run the sitemap generation task
- Deploying (to a Digital Ocean box using Dokku)
- Sending HTML emails.
- Separating admin area from frontend using differnt layouts and scopes in
I will be writing about this is a lot more detail on my blog soon.
- Clone the repository and install the dependencies
git clone firstname.lastname@example.org:authentic-pixels/exshop.git cd exshop mix deps.get npm install
- Create the database and run the migrations
mix ecto.create mix ecto.migrate
- Create an admin user. You can change the email and password in
mix run priv/repo/seeds.exs
- Add your Cloudinary keys. Create a file called
configfolder with the following contents. Be sure to change the 'name', 'api_key' and 'api_secret' fields.
use Mix.Config config :cloudini, api_key: "CHANGE_ME", api_secret: "CHANGE_ME", name: "CHANGE_ME", stub_requests: false, http_options: [timeout: 15000]
- Start the server
iex -S mix phoenix.server
- Set up your test database
MIX_ENV=test mix ecto.reset
- Run all the tests on file change
- Create sitemaps
- Cron task to update sitemaps frequently
- Add archives page to blog
- Create RSS feeds
- Explore Google AMP versions for product/post pages
- Write integration tests for admin area
The Elixir/Phoenix community is really welcoming & responsive. There are tons of nice examples and packages that helped me with my learning. Here are some of the elixir packages that I am using in this project -
- Comeonin for password hashing
- test.watch for running tests
- Bamboo for sending emails
- Cloudini for uploading images to Cloudinary
- Quantum for running cron tasks
- Curtail for truncating HTML snippets
- XML builder for generating Sitemaps
- Kerosene for pagination