This guide will walk you through adding a ChatGPT-like messaging stream to your Ruby on Rails 7 app using ruby-openai, Rails 7, Hotwire, Turbostream, Sidekiq and Tailwind. All code included below!
First, add the ruby-openai gem! Needs to be at least version 4. Add Sidekiq too.
When writing a string of multiple utility classes, always do so in an order with meaning. The "Concentric CSS" approach works well with utility classes (i.e,. 1. positioning/visibility 2. box model 3. borders 4. backgrounds 5. typography 6. other visual adjustments). Once you establish a familiar pattern of ordering, parsing through long strings of utility classes will become much, much faster so a little more effort up front goes a long way!
Always use fewer utility classes when possible. For example, use mx-2 instead of ml-2 mr-2 and don't be afraid to use the simpler p-4 lg:pt-8 instead of the longer, more complicated pt-4 lg:pt-8 pr-4 pb-4 pl-4.
Prefix all utility classes that will only apply at a certain breakpoint with that breakpoint's prefix. For example, use block lg:flex lg:flex-col lg:justify-center instead of block lg:flex flex-col justify-center to make it very clear that the flexbox utilities are only applicable at the
Fish is a smart and user-friendly command line (like bash or zsh). This is how you can instal Fish on MacOS and make your default shell.
Note that you need the https://brew.sh/ package manager installed on your machine.
brew install fish
Installing node through Homebrew can cause problems with npm for globally installed packages. To fix it quickly, use the solution below. An explanation is also included at the end of this document.
This solution fixes the error caused by trying to run npm update npm -g. Once you're finished, you also won't need to use sudo to install npm modules globally.
By: @BTroncone
Also check out my lesson @ngrx/store in 10 minutes on egghead.io!
Update: Non-middleware examples have been updated to ngrx/store v2. More coming soon!
Table of Contents
| // I hate converting units so here's how to do | |
| // px to rem conversion with a fallback to px | |
| // for older browsers... | |
| /** | |
| * Resize font from one type to another | |
| * @param {[type]} $fontSize the font size that you want | |
| * @param {[type]} $toUnit: rem the unit you want to convert to | |
| * @param {[type]} $fromUnitSpecific: px default unit we're going to convert from (if you don't set it) | |
| * |
| # All this commands are listed on the docs | |
| # I just put everything together. | |
| git clone https://github.com/deis/deis.git | |
| cd deis/ | |
| git checkout v1.7.3 | |
| # make sure you have access to https://discovery.etcd.io/ | |
| make discovery-url | |
| # After running the command above, make sure that you have |
| wait4eth1() { | |
| CNT=0 | |
| until ip a show eth1 | grep -q UP | |
| do | |
| [ $((CNT++)) -gt 60 ] && break || sleep 1 | |
| done | |
| sleep 1 | |
| } | |
| wait4eth1 |
Goal of this Document / Gist is to layout the resources and challenges to writing a complete modern web app with Phoenix and Elixir as the state of the projects are starting on June 2015
