FrancelWebdev francelwebdev

Create a Contact Form in Rails 5

2021 UPDATE: some parts of this tutorial are now out of date, please use Create a Contact Form in Rails 6 instead. The rails 5 / gmail version remains below for posterity.

This is a complete, step-by-step tutorial showing how to create a fully functional contact form in production in rails 5. Rather than reinvent things, the following borrows from the best available documentation and tutorials (most notably, this tutorial on making a contact form in development). The finished contact form can be viewed here.

Stimulus cheatsheet

Website: https://stimulusjs.org/
GitHub repo: https://github.com/stimulusjs/stimulus
Handbook: https://stimulusjs.org/handbook/introduction
Discourse: https://discourse.stimulusjs.org/

Lifecycle callbacks

initialize: once, when the controller is first instantiated
connect: anytime the controller is connected to the DOM

Cheat Sheet: Simple Authentication in Rails 6 with `has_secure_password`

The goal of this cheatsheet is to make it easy to add hand-rolled authentication to any rails app in a series of layers.

First the simplest/core layers, then optional layers depending on which features/functionality you want.

`Specs`
AUTHOR	Ira Herman
LANGUAGE/STACK	Ruby on Rails Version 4, 5, or 6

npm rank

This gist is updated daily via cron job and lists stats for npm packages:

Top 1,000 most depended-upon packages
Top 1,000 packages with largest number of dependencies
Top 1,000 packages with highest PageRank score

The MONGOID Cheat Sheet

( Source: the mongoid cheatsheet )

Example

  class User

include Mongoid::Document

	HTML
	- Semantic HTML
	- Event delegation
	- Accessibility / ARIA

	CSS
	- Specificity
	- Pseudo-elements
	- Pseudo-selectors
	- Combinators

	<% # app/views/layouts/admin.html.erb %>

	<!DOCTYPE html>
	<html>
	<head>
	<title>Admin Interface</title>
	<%= csrf_meta_tags %>

	<% # Optionally use admin-specific assets here instead of the normal application assets %>
	<%= stylesheet_link_tag 'admin', media: 'all', 'data-turbolinks-track': 'reload' %>

	<!-- http://bootsnipp.com/snippets/8AGX3 -->
	<!-- http://bootsnipp.com/snippets/featured/form-wizard-and-validation -->
	<!-- https://www.codeply.com/go/RsUnW5kOcs#! -->
	<div class="container">
	<div class="row">
	<div class="col-md-8 col-md-offset-2">
	<div class="panel panel-default">
	<div class="panel-heading">Dashboard</div>

	<div class="panel-body">