Reactchat
A chat app built with React.js and ActionCable in Ruby on Rails 5.1
Install / Use
/learn @learnetto/ReactchatREADME
React Chat
A chat app built with React.js and ActionCable in Ruby on Rails 5.1, built as part of a 2-part tutorial on Learnetto:
How to build a chat app with Rails 5.1 ActionCable and React.js Part 1
How to build a chat app with Rails 5.1 ActionCable and React.js Part 2
Run the following commands on the commandline to get it working:
git clone https://github.com/learnetto/reactchat.git
cd reactchat
rails db:migrate
bundle && yarn
foreman start -f Procfile.dev
Github Authentication
We use Github for authentication. So you will need to register a new OAuth application on Github.
Please make sure you set the authorization callback URL correctly. With the default devise and omniauth settings, add /users/auth/github/callback to your root URL.
For example, in development, if your app is running on localhost port 3000, then the URL settings will be:
Homepage URL: http://localhost:3000
Authorization callback URL: http://localhost:3000/users/auth/github/callback
Once you've set up your Github app, Github will provide you with a Client ID and secret. You need to add these to your app's environment as GITHUB_APP_ID and GITHUB_APP_SECRET.
For development, the easiest way is to put them in your ~/.bash_profile, start a new terminal window and restart your Rails server.
Related Skills
bluebubbles
345.9kUse when you need to send or manage iMessages via BlueBubbles (recommended iMessage integration). Calls go through the generic message tool with channel="bluebubbles".
node-connect
345.9kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
slack
345.9kUse when you need to control Slack from OpenClaw via the slack tool, including reacting to messages or pinning/unpinning items in Slack channels or DMs.
frontend-design
106.4kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
