Repository: railsgirls/guides.railsgirls.com Branch: main Commit: dbc9fe93f372 Files: 86 Total size: 454.4 KB Directory structure: gitextract_3vukf4_h/ ├── .github/ │ ├── dependabot.yml │ └── workflows/ │ └── deploy.yml ├── .gitignore ├── .ruby-version ├── 404.html ├── Gemfile ├── LICENSE ├── README.md ├── _config.yml ├── _includes/ │ ├── analytics.html │ ├── footer.html │ ├── github-corner.html │ ├── header.html │ ├── main-guide-intro.html │ └── main_guides.md ├── _layouts/ │ ├── default.html │ ├── guide.md │ └── main_guide.md ├── _pages/ │ ├── activeadmin.md │ ├── app.md │ ├── coach.md │ ├── commenting.md │ ├── continuous-codeship.md │ ├── continuous-snap-ci.md │ ├── continuous-travis.md │ ├── contributing.md │ ├── deployment/ │ │ ├── anynines.md │ │ ├── digital-ocean.md │ │ ├── engineyard.md │ │ ├── fly-io.md │ │ ├── heroku.md │ │ └── openshift.md │ ├── deployment.md │ ├── design-using-html-and-css-chinese.md │ ├── design.md │ ├── devise.md │ ├── diary-app.md │ ├── github.md │ ├── gravatar.md │ ├── guide-to-the-guide.md │ ├── guide.md │ ├── how-to-continue-with-programming.md │ ├── html-and-css.md │ ├── install/ │ │ ├── linux.md │ │ ├── macos.md │ │ ├── replit.md │ │ ├── virtual-machine.md │ │ └── windows.md │ ├── install.md │ ├── new-homepage.md │ ├── new-page.md │ ├── passenger.md │ ├── remote-pairing-for-the-win.md │ ├── ruby-atm.md │ ├── ruby-game.md │ ├── ruby-intro.md │ ├── shoulda-matchers.md │ ├── simple-app.md │ ├── sinatra-app-tutorial.md │ ├── sinatra-html.md │ ├── sinatra.md │ ├── start.md │ ├── test-driven-development.md │ ├── testing-rspec.md │ ├── thumbnails.md │ ├── tools.md │ ├── touristic-autism_basic-app.md │ ├── touristic-autism_continuous-deployment.md │ ├── touristic-autism_design.md │ ├── touristic-autism_git.md │ ├── touristic-autism_google-map.md │ ├── touristic-autism_image-upload.md │ ├── touristic-autism_intro.md │ ├── touristic-autism_resource-modeling.md │ ├── touristic-autism_resource-rating.md │ ├── touristic-autism_static-pages-tdd.md │ ├── twitter-widget.md │ ├── uploads.md │ └── videos.md ├── _plugins/ │ └── coach.rb ├── css/ │ ├── code.css │ └── style.css ├── index.html └── js/ ├── guides.js ├── js.cookie.js └── mobile-menu.js ================================================ FILE CONTENTS ================================================ ================================================ FILE: .github/dependabot.yml ================================================ version: 2 updates: - package-ecosystem: 'github-actions' directory: '/' schedule: interval: 'weekly' ================================================ FILE: .github/workflows/deploy.yml ================================================ name: Deploy site on: # Runs on pushes targeting the default branch push: branches: ["main"] # Allows you to run this workflow manually from the Actions tab workflow_dispatch: # Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages permissions: contents: read pages: write id-token: write # Allow one concurrent deployment concurrency: group: "pages" cancel-in-progress: true jobs: # Build job build: runs-on: ubuntu-latest steps: - name: Checkout uses: actions/checkout@v6 - name: Setup Ruby uses: ruby/setup-ruby@6ca151fd1bfcfd6fe0c4eb6837eb0584d0134a0c # v1.290.0 with: bundler-cache: true # runs 'bundle install' and caches installed gems automatically cache-version: 0 # Increment this number if you need to re-download cached gems - name: Setup Pages id: pages uses: actions/configure-pages@v5 - name: Build with Jekyll # Outputs to the './_site' directory by default run: bundle exec jekyll build --baseurl "${{ steps.pages.outputs.base_path }}" env: JEKYLL_ENV: production - name: Upload artifact # Automatically uploads an artifact from the './_site' directory by default uses: actions/upload-pages-artifact@v4 # Deployment job deploy: environment: name: github-pages url: ${{ steps.deployment.outputs.page_url }} runs-on: ubuntu-latest needs: build steps: - name: Deploy to GitHub Pages id: deployment uses: actions/deploy-pages@v4 ================================================ FILE: .gitignore ================================================ .bundle/ _site/ .DS_Store *.swp ================================================ FILE: .ruby-version ================================================ 3.2.8 ================================================ FILE: 404.html ================================================ --- layout: default title: "Page not found" permalink: /404.html ---
The page you are looking for does not exist.
It may have moved, renamed or deleted.
Please visit the guides homepage for a list of all available guides.
The purpose of Rails Girls is to give tools for women to understand technology. The Rails Girls events do this by providing a great first experience on building the Internet.
Rails Girls was founded at the end of 2010 in Helsinki. Originally intended as a one-time event, we never thought to see so many chapters from all around the world! This guide will help you get started.
You can use our materials and instructions to roll out your own workshop in your city, workplace or kitchen! Read more about Rails Girls at https://railsgirls.com
## Quick start
View the guides at https://guides.railsgirls.com or clone this repo and install & run [jekyll](https://github.com/mojombo/jekyll)
### Installing jekyll
```
$ cd guides.railsgirls.com
```
```
$ bundle install
```
### Pygments and Code Highlighting
The guides use the [pygments](https://pygments.org/) library to do syntax highlighting. If you don't have it installed you won't be able to see the highlight sections like the following:
```
{% highlight %}
{% endhighlight %}
```
If you aren't editing the code blocks, you can safely ignore this. If you want pygments, you can follow the [install instructions](https://jekyllrb.com/docs/installation/) in the "Pygments" section.
### Coach highlights
A custom Liquid tag is available for coach notes. Add these to guides when you want the coach to explain something. Use this tag to make sure the visual element is always the same and easy to recognize.
```
{% coach %}
Add helpful text here for the coach!
{% endcoach %}
```
### Run jekyll
```
$ bundle exec jekyll server --watch
```
### Styling
Wrap keyboard shortcuts with [kbd](https://www.w3.org/wiki/HTML/Elements/kbd) HTML tag.
To make posts consistent in style use `Ctrl+C` over `CTRL-c`/`ctrl+c`
```
To shut down the server you can hit Ctrl+C
```
### Having trouble?
You might find some useful hints in this jekyll issue if it's not working as expected: [Issue 503](https://github.com/mojombo/jekyll/issues/503)
## Contributing a Guide
To contribute a guide, view the instructions at https://guides.railsgirls.com/contributing
## X
For updates and more, follow [@railsgirls](https://twitter.com/railsgirls) on X
## Website & Blog
Official website and blog for Rails Girls movement can be found at https://railsgirls.com
## E-mail list
Global mailing list for Rails Girls events can be found at https://groups.google.com/group/rails-girls-team
## Credits
* Karri Saarinen / [@karrisaarinen](https://twitter.com/karrisaarinen) / [github](https://github.com/ksaa)
* Linda Liukas / [@lindaliukas](https://twitter.com/lindaliukas) / [github](https://github.com/lindaliukas)
* Vesa Vänskä / [@vesan](https://twitter.com/vesan) / [github](https://github.com/vesan)
* Terence Lee / [@hone02](https://twitter.com/hone02) / [github](https://github.com/hone)
* Tom de Bruijn / [@tombruijn](https://mastodon.social/@tombruijn) / [GitHub](https://github.com/tombruijn)
..and all the other coaches and people making Rails Girls awesome. Please add yourself!
## LICENSE
[](https://creativecommons.org/licenses/by-sa/2.0/)
================================================
FILE: _config.yml
================================================
permalink: pretty
markdown: kramdown
include:
- _pages
exclude:
- ".rvmrc"
- ".rbenv-version"
- ".ruby-version"
- "CNAME"
- "Gemfile"
- "Gemfile.lock"
- "README.md"
- "node_modules/"
- "vendor/bundle/"
- "vendor/cache/"
- "vendor/gems/"
- "vendor/ruby/"
url: https://guides.railsgirls.com
source_url: https://github.com/railsgirls/guides.railsgirls.com/blob/main/
plugins:
- jekyll-redirect-from
site_title: "Rails Girls Guides"
default_page_description: "Learn how to make your own web apps with the Rails Girls guides."
================================================
FILE: _includes/analytics.html
================================================
================================================
FILE: _includes/footer.html
================================================
================================================
FILE: _includes/github-corner.html
================================================
================================================
FILE: _includes/header.html
================================================
You can verify that a directory named projects was created by running the list command: ls. You should see the projects directory in the output. Now you want to change the directory you are currently in to the projects folder by running:
You can verify you are now in an empty directory or folder by again running the ls command. Now you want to create a new app called railsgirls by running:
This will create a new app in the folder railsgirls, so we again want to change the directory to be inside of our Rails app by running:
If you run ls inside of the directory you should see folders such as app and config. You can then start the Rails server by running:
You can verify that a directory named projects was created by running the list command: dir. You should see the projects directory in the output. Now you want to change the directory you are currently in to the projects folder by running:
You can verify you are now in an empty directory or folder by again running the dir command. Now you want to create a new app called railsgirls by running:
This will create a new app in the folder railsgirls, so we again want to change the directory to be inside of our Rails app by running:
If you run dir inside of the directory you should see folders such as app and config. You can then start the Rails server by running:
<%= comment.user_name %>
<%= comment.body %>
<%= button_to "Destroy this comment", idea_comment_path(@idea, comment), method: :delete, class: "btn btn-danger", form: { data: { turbo_confirm: "Are you sure?" } } %>No comments found.
<% end %>
---
layout: guide
title: Contributing a Guide
permalink: contributing
---
You can follow the structure of our [Rails Girls App Tutorial](https://github.com/railsgirls/railsgirls.github.com/blob/master/_pages/app.md).
## If you want to improve an existing guide:
Make the change in the file you want to change! You don't need to make a new file if you want to change something in an existing file.
## Then...
1. Commit this new guide to your Git repo.
2. After you commit, push that to your fork.
3. You can now open a pull request explaining your guide. That's it!
Thanks so much for taking the time to help us make Rails Girls awesome.
================================================
FILE: _pages/deployment/anynines.md
================================================
---
layout: main_guide
title: Rails Girls on anynines
description: "Deploy your app to Anynines by following this guide."
permalink: deployment/anynines
---
# Put your app online with anynines
*Created by Floor Drees, [@floordrees](https://twitter.com/floordrees)*
{% coach %}
Talk about the benefits of deploying to anynines vs utilising US data centers.
{% endcoach %}
### Get yourself some anynines
1. [Create an anynines account](https://anynines.com/).
2. [Download and install the Command Line Interface](https://anynines.zendesk.com/entries/60241846-How-to-install-the-CLI-v6) to interact with anynines.
3. Now select the anynines api endpoint as target and authenticate using your user credentials:
{% highlight sh %}
cf api https://api.de.a9s.eu
cf login -u [your@email] -p [yourpassword]
{% endhighlight %}
Or if that doesn't work for you, use:
{% highlight sh %}
cf login
{% endhighlight %}
... which will prompt you for your email address and password.
Wonder what that `cf` stands for? It's short for [Cloud Foundry](https://www.cloudfoundry.org/), a system anynines is using behind the scenes.
### Push your app online
Let's push this source code from your local machine to anynines:
{% highlight sh %}
$> cf push [application-name-of-your-choosing]
{% endhighlight %}
This will fail miserably since the example application needs a MySQL database to start. So, lets create one! The command below will create a MySQl service with a free service plan. After the plan name you have to specify a name for the service instance. This name will be used for further commands to refer to this service instance:
$> cf create-service mysql Pluto-free [service-name-you-can-choose]
(Really, you can use any name. Make it count!)
Next, binding the MySQL service instance to the application, to grant the application access to the MySQL instance, type:
{% highlight sh %}
$> cf bind-service [app-name-you-have-chosen-above] [service-name-you-have-chosen-above]
{% endhighlight %}
Finally we have to restart the application to make sure the service binding takes effect:
{% highlight sh %}
$> cf restart [app-name-you-have-chosen-above]
{% endhighlight %}
You will see this:
{% highlight sh %}
Creating service postgresql-d2197... OK
Binding postgresql-d2197 to railsgirls... OK
{% endhighlight %}
Ending with... `Push successful! App 'railsgirls' available at railsgirls.de.a9sapp.eu`. Score!
### Version Control
We need to add our new code to version control. You can do this by running the following in the terminal:
{% highlight sh %}
git status
git add .
git commit -m "add anynines deployment"
{% endhighlight %}
{% coach %}
This would be a great time to talk about version control systems and git, if you haven't already.
{% endcoach %}
### Help
You can check all available cf sub-commands by typing `cf help`.
In case your terminal does not have all the answers, the anynines team probably does. Just shoot them a mail at support@anynines.com.
Happy deploying!
================================================
FILE: _pages/deployment/digital-ocean.md
================================================
---
layout: main_guide
title: Rails Girls on DigitalOcean
description: "Deploy your app to DigitalOcean by following this guide."
permalink: deployment/digitalocean
---
# Put Your App Online With DigitalOcean App Platform
*Created by [Colin Alston](https://github.com/calston)*
## Change the production database
Locally your app uses SQLite as the database to store your ideas. It's easier to use another database on DigitalOcean deploys. To deploy with DigitalOcean we'll change the database in production to use PostgreSQL.
### Install the pg gem
Open the `Gemfile` file in your Text Editor and change the following line:
{% highlight ruby %}
gem "sqlite3"
{% endhighlight %}
into these lines:
{% highlight ruby %}
group :development do
gem "sqlite3"
end
group :production do
gem "pg"
end
{% endhighlight %}
Next, run the command below to setup the new database gem:
{% highlight sh %}
bundle install --without production
{% endhighlight %}
### Update the database configuration
Up next, you'll need to change the database configuration for the production environment.
{% coach %}
Explain what the different Rails environments are. What is "production"?
{% endcoach %}
Open the `config/database.yml` file in your Text Editor. Change the following lines in the file:
{% highlight yaml %}
production:
<<: *default
database: storage/production.sqlite3
{% endhighlight %}
to these lines:
{% highlight yaml %}
production:
adapter: postgresql
encoding: unicode
pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
database: railsgirls_production
username: railsgirls
password: <%= ENV["RAILSGIRLS_DATABASE_PASSWORD"] %>
{% endhighlight %}
Save the changes in Git by creating a new commit. We'll need to update our app in Git to deploy these changes.
{% highlight sh %}
git add .
git commit -m "Use PostgreSQL as the production database"
{% endhighlight %}
## Create an account
Head to [https://www.digitalocean.com/go/app-platform](https://www.digitalocean.com/go/app-platform) and sign up for the 60 day free trial.

Sign up using Github to link your account

You will need a credit card but will receive $200 to start with if this is your first time using DigitalOcean.

## Create an application
Click on `Deploy a web application` to get started.

Choose "Deploy your web app" to add an existing GitHub repository

Authorize DigitalOcean to read your repositories

Select the repository for your application


Click `Next` to continue then `Edit Plan` to ensure we use the appropriate resources. We will start with a Basic plan and the smallest container size which should be sufficient.

Continue through the next steps until the end. We should not need to change anything else.


## Deploying our Rails application
Wait for the application to build, you can view realtime logs of the process while it happens.

If all went well you should see your application is available, however it still needs to be initialized and have a database added.

Click on `Create` and `Create/Attach Database` to connect a PostgreSQL database.

The application will automatically be configured with the database credentials
## Configuration
You can now head to the `Console` to access your application container and setup the database.
Type `rails db:migrate` into the terminal and press Enter. You should see the database being setup with the Rails schema.

If all went well you should now be able to click on the `Live App` button which links to the live server.

## Conclusion
Your Rails app is now running in the cloud on DigitalOcean. You can push your changes to GitHub and they'll show up automatically the live URL after some time. Share the URL to show off your app to your friends!
Keep an eye out when your free credits run out and delete the app if you no longer need it.
================================================
FILE: _pages/deployment/engineyard.md
================================================
---
layout: main_guide
title: Rails Girls on Engine Yard
description: "Deploy your app to Engine Yard by following this guide."
permalink: deployment/engineyard
---
# Put Your App Online With Engine Yard
*Created by Mary Jenn, [@mfjenn](https://twitter.com/mfjenn)*
#### Ensure You're Using PostGres for Your Database
You'll need to get your database to work on Engine Yard, which uses a different database than the Rails default. Please change the following in the Gemfile:
gem 'sqlite3'
to
group :development do
gem 'sqlite3'
end
group :production do
gem 'pg'
end
Run `bundle install --without production` to setup your dependencies.
#### Version Control Systems
You need to add your app to your Git repository. You can do this by running the following in the terminal:
> `git init`
> `git add .`
> `git commit -m "initial commit"`
{% coach %}
This would be a good time to talk about version control systems and git.
{% endcoach %}
### Be Sure to Have a Rails Application in a Repository on Github
You will need to have a GitHub account and a repo we can pull an app from. Follow these directions on [GitHub](https://help.github.com/articles/create-a-repo) to create a repo and push your app to it. If you do not have a working Rails application, you can fork [Engine Yard's sample todo app](https://github.com/engineyard/todo) to your own repo. A coach can walk you through this if you need help.
### Sign up for a Free Trial Engine Yard Account
Go to Engine Yard's [Website](https://www.engineyard.com/) and click on "GET STARTED FREE" to sign up for your Free 500 Hour Trial. The sign up will send you a confirmation email, so go check your email, click on the link and sign in to your account. Click on the link under "Your available applications" that says "Engine Yard Cloud". This will take you to your dashboard.
### Create your Engine Yard Cloud account
1. Choose a name for your account. We suggest picking something relevant to who you are, either as a developer, or as an organization if you will be having collaborators. Click the button "Start Trial"
2. Feel free to explore what is in the drop downs, but let's go with the defaults for now, since they are in line with a basic Rails app.
3. In the box labeled "Git Repository URI", paste the URI from your Github repo. Be sure to use the URI from the SSH version of your application. HINT: The format should be the same as the placeholder text on your Engine Yard application page (or like this: "git@github.com:mfjenn/blogotron.git")
### Putting Your Deploy Key in Place
You should now be on a page that says "Allow Engine Yard access to private repository".
1. Copy the block of text in the box and go to your GitHub settings page.
2. Go to the SSH page
3. Click on the button that says "add a key"
4. Paste the block of text from your Engine Yard page here. Save it
5. Go back to your Engine Yard Page and Click the button that says, "My deploy key is in place".
{% coach %}
Talk about the difference between private and public repos and when to use either.
{% endcoach %}
### Creating and Configuring Your Environment
Once you click the "My deploy key is in place" button, you will be taken to a page that says, "Create New Environment for (Your Account Name) App". It is here where we will configure your application. Feel free to explore all the options in the drop downs, but let's use the defaults for now. You do not need to set a domain name.
* Click the button that says, "Create Environment".
#### Environment Setup
On this page, let's select the staging configuration.
* Click "Boot This Configuration". You will go to a new page where you see several status bars moving. Our Platform is provisioning your instances. We need to wait till these turn to green dots. This usually takes about 10 minutes, so does anyone need to take a break? It's a good time to go grab some water or a coffee.
{% coach %}
Talk about Staging vs. Production, and why it's important to have replicas. Talk about what is a master & Slave. How does Engine Yard's Failover work? Why is that important?
{% endcoach %}
#### Deploying Your Application
1. Once all of the lights are green, click "Deploy".
2. Once you see the phrase "YOUR NAME successfully deployed HEAD" you will know it has been deployed! Congratulations!
3. Click on the link that says "View your application" to visit your application online.
4. If you get a red notification that your deploy failed, we just have some debugging to do. Raise your hand and a coach can come over to to help.
#### Stopping Your Instances to Save Your Hours
Once you've got your app up & running, be sure to click the "stop" button to stop the instances so that your don't burn through all of your hours. You can always start them again.
### Additional Resources
* [A video tutorial](https://support.cloud.engineyard.com/entries/21009937-Video-Tutorial-Set-up-an-Account-and-Deploy-an-Application)
* [Another Tutorial From the Engine Yard Site](https://support.cloud.engineyard.com/entries/20996751-Tutorial-How-to-Deploy-the-ToDo-Application-on-a-Trial-Account)
================================================
FILE: _pages/deployment/fly-io.md
================================================
---
layout: main_guide
title: Put your app online with Fly.io
description: "Deploy your app to Fly.io by following this guide."
permalink: deployment/fly-io
---
# Put your app online with Fly.io
In this guide you'll deploy your app with [Fly.io](https://fly.io) to make it available to everyone online. After this guide you can share the link with your friends and family to show what you have created during this workshop.
Deploying a single small app with Fly.io is free, with some limitations.
{% coach %}
Talk about the benefits of deploying to Fly.io versus traditional servers.
{% endcoach %}
## Change the production database
Locally your app uses SQLite as the database to store your ideas. It's easier to use another database on Fly.io deploys. To deploy with Fly.io we'll change the database in production to use PostgreSQL.
### Install the pg gem
Open the `Gemfile` file in your Text Editor and change the following line:
{% highlight ruby %}
gem "sqlite3"
{% endhighlight %}
into these lines:
{% highlight ruby %}
group :development do
gem "sqlite3"
end
group :production do
gem "pg"
end
{% endhighlight %}
Next, run the command below to setup the new database gem:
{% highlight sh %}
bundle install --without production
{% endhighlight %}
### Update the database configuration
Up next, you'll need to change the database configuration for the production environment.
{% coach %}
Explain what the different Rails environments are. What is "production"?
{% endcoach %}
Open the `config/database.yml` file in your Text Editor. Change the following lines in the file:
{% highlight yaml %}
production:
<<: *default
database: storage/production.sqlite3
{% endhighlight %}
to these lines:
{% highlight yaml %}
production:
adapter: postgresql
encoding: unicode
pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
database: railsgirls_production
username: railsgirls
password: <%= ENV["RAILSGIRLS_DATABASE_PASSWORD"] %>
{% endhighlight %}
Save the changes in Git by creating a new commit. We'll need to update our app in Git to deploy these changes.
{% highlight sh %}
git add .
git commit -m "Use PostgreSQL as the production database"
{% endhighlight %}
## Create a Fly.io account
Visit the [Fly.io sign up page](https://fly.io/app/sign-up) and fill in the form to make a new user account.
On the next screen, click the "Try Fly.io for free" link. You do not need to enter your Credit Card to use Fly.io for free.
## Install the Fly.io CLI
To deploy apps with Fly.io, you'll need to use the Fly.io CLI: a tool for the Terminal app.
Follow the [installation instructions on this Fly.io docs page](https://fly.io/docs/hands-on/install-flyctl/). Continue with this guide when the Fly.io CLI has been installed.
## Login to the Fly.io CLI
Run the following command to connect your Fly.io user account to your laptop and deploy your app with Fly.io in the Terminal app.
{% highlight sh %}
flyctl auth login
{% endhighlight %}
It will open your Browser with a new tab/window. Either login to your Fly.io user account you created earlier, or click the button starting with "Continue as ...". You are now logged into Fly.io with the CLI.
## Configure the app
Run the following command create the necessary configuration in your app to deploy it.
{% highlight sh %}
fly launch
{% endhighlight %}
When prompted for questions, enter or select the following:
- Choose an app name:
- Enter: railsgirls-yourname
- Change "yourname" to your (nick)name.
- Choose a region for deployment:
- Choose the region closest to you with the arrow keys and then press Enter.
- Would you like to set up a Postgresql database now?
- Press y and then press Enter.
- Select configuration:
- Choose "Development" from the list.
- Would you like to set up an Upstash Redis database now?:
- Press n and then press Enter.
Your app is now configured to deploy with Fly.io. You'll need to commit these changes before you can deploy. Commit your changes with this command:
{% highlight sh %}
git add .
git commit -m "Configure for Fly.io deployment"
{% endhighlight %}
## Deploy the app in the future
If you made any new changes to your app and want to deploy the changes in the future, run the following command:
{% highlight sh %}
fly deploy
{% endhighlight %}
You'll see a lot of text being printed about the results of the steps needed to deploy the app. Wait until it's done. It should say "v0 deployed successfully".
## View your deployed app
Your app should now be deployed. This means it's online for people to see. To know where you can view it, run the following command to open it in your Browser:
{% highlight sh %}
fly open
{% endhighlight %}
You now have your first app deploy! Congratulations! Share the link you see in your Browser's address bar!
---
You do not need to deploy your app on another services. Continue with the next numbered guide in the list below.
================================================
FILE: _pages/deployment/heroku.md
================================================
---
layout: main_guide
title: Put your app online with Heroku
description: "Deploy your app to Heroku by following this guide."
permalink: deployment/heroku
---
# Put your app online with Heroku
*Created by Terence Lee, [@hone02](https://twitter.com/hone02)*
## Get Heroku
Follow steps "Introduction" and "Set up" of the
[Getting Started on Heroku with Ruby][heroku-guide] to sign up, install the
Heroku CLI, and login.
{% coach %}
Talk about the benefits of deploying to Heroku vs traditional servers.
{% endcoach %}
[heroku-guide]: https://devcenter.heroku.com/articles/getting-started-with-ruby#introduction
## Updating our database
First, we need to get our database to work on Heroku, which uses a different
database. Please change the following in the Gemfile:
{% highlight ruby %}
gem "sqlite3"
{% endhighlight %}
to
{% highlight ruby %}
group :development do
gem "sqlite3"
end
group :production do
gem "pg"
end
{% endhighlight %}
Run `bundle install --without production` to setup your dependencies.
Next, update the `config/database.yml` file.
Change the following lines in the file:
{% highlight yaml %}
production:
<<: *default
database: storage/production.sqlite3
{% endhighlight %}
to these lines:
{% highlight yaml %}
production:
adapter: postgresql
encoding: unicode
database: railsgirls_production
pool: 5
{% endhighlight %}
Then save the changes in Git by creating a new commit. We'll need to update our app in Git to deploy the new version to Heroku.
{% highlight sh %}
git add .
git commit -m "Use postgres as production database"
{% endhighlight %}
{% coach %}
You can talk about RDBMS and the different ones out there, plus include some details on Heroku's dependency on PostgreSQL.
{% endcoach %}
## Deploying your app
### App creation
We need to create our Heroku app by typing `heroku create` in the terminal and
see something like this:
{% highlight sh %}
Creating app... done, ⬢ young-reaches-87845
https://young-reaches-87845.herokuapp.com/ | https://git.heroku.com/young-reaches-87845.git
{% endhighlight %}
In this case "young-reaches-87845" is your app name.
### Pushing the code
Next we need to push our code to heroku by typing `git push heroku master`.
You'll see push output like the following:
{% highlight sh %}
Counting objects: 115, done.
Delta compression using up to 8 threads.
Compressing objects: 100% (97/97), done.
Writing objects: 100% (115/115), 25.62 KiB | 0 bytes/s, done.
Total 115 (delta 10), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Ruby app detected
remote: -----> Compiling Ruby/Rails
remote: -----> Using Ruby version: ruby-2.2.4
remote: -----> Installing dependencies using bundler 1.11.2
remote: Running: bundle install --without development:test --path vendor/bundle --binstubs vendor/bundle/bin -j4 --deployment
remote: Fetching gem metadata from https://rubygems.org/..........
remote: Fetching version metadata from https://rubygems.org/...
remote: Fetching dependency metadata from https://rubygems.org/..
remote: Installing concurrent-ruby 1.0.2
...
remote: -----> Launching...
remote: Released v5
remote: https://young-reaches-87845.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/young-reaches-87845.git
* [new branch] master -> master
{% endhighlight %}
You'll know the app is done being pushed, when you see the "Launching..." text like above.
### Migrate database
Next we need to migrate our database like we did locally during the workshop:
{% highlight sh %}
heroku run rails db:migrate
{% endhighlight %}
When that command is finished being run, you can hit the app based on the url.
For this example app, you can go to | <%= text %> | <%= @votes[id] || 0 %> | <%= '#' * (@votes[id] || 0) %> |
|---|
URLs reveal the resource you want, but the action that needs to be performed on that resource needs to be specified using HTTP verbs.
The most common HTTP verbs are
* GET: fetch an existing resource
* POST: create a new resource. (Usually includes data needed to create the new resource)
* PUT: update an existing resource.
* DELETE: delete an existing resource.
You would have used all these verbs on your Rails Girls app when you enabled it to show, create, edit and delete posts or notes.
A request to a server needs to include both a URL and HTTP verb.
In the following exercises you will build a small coffee listing application that uses a combination of resource folder names and HTTP verbs to show how browsers communicate with your application.
Your app will look something like this in the browser:
## *0.* Install Sinatra - "Hello World"
Let's start off by getting Sinatra running.
In your terminal, install the gem:
{% highlight sh %}
gem install sinatra
gem install sinatra-contrib
{% endhighlight %}
## *1.* "Hello World"
Create a file called `app.rb` and paste the following into your Text Editor:
{% highlight ruby %}
require "sinatra"
require "sinatra/reloader"
get "/" do
"Hello world!"
end
{% endhighlight %}
And back in your terminal, run this code with:
{% highlight sh %}
ruby app.rb
{% endhighlight %}
View your current site at:
You might have seen this sometimes when you've submitted forms online. Having this warning prompts us to think about the consequences of our refresh and we will probably avoid inadvertently adding the same coffee multiple times.
Remember GET requests are asking to fetch a resource, whereas POST requests are asking to create a resource. If you refresh a page on a GET request, you are simply asking repeatedly to see the same page, which usually won't be a problem.
However, if you refresh a page on a POST request, this means you are resending the POST request, and could be creating a new resource each time you refresh. That's why the browser gives you a warning before allowing you to do it.
## *10.* Add a Redirect
In order to get around this form-resubmission problem, lets tell the browser to load a different page as soon as it receives the response to our `POST`. We do this using a special HTTP response known as a "redirect".
Instead of the call to our `template` method, we can redirect the browser to another location.
In Sinatra, it looks like this:
{% highlight ruby %}
redirect "/"
{% endhighlight %}
Try first, then [check it here](https://tjmcewan.github.io/coffeecalc/snippets/post_redirect.rb.txt).
This sends back a special redirect response (HTTP 303) with a `location` header that specifies where the browser should go:
{% highlight HTML %}
HTTP/1.1 303 See Other
<…>
Location: http://localhost:4567/
{% endhighlight %}
To see this in action, have a look in Chrome's Web Inspector (Network tab) and send your app a coffee:
The first line shows the browser submitting the form via the `POST` request method. The response it receives is an HTTP 303, containing the `Location` header. It then issues a `GET` request for that location (which corresponds to our root URL, "/") and renders the response it gets from there - which is our HTML template.
Now you can refresh all you want and all you're doing is requesting using `GET`, not `POST`. Your browser doesn't have to submit the form any more to display that page.
This is the end of the tutorial - you've done an excellent job!
Thanks for playing!
## Additional Guides
If you were fast and would like to continue on, you can try:
* [Rendering our coffee list in proper HTML](/sinatra-html)
**LUCY-TODO**
================================================
FILE: _pages/start.md
================================================
---
layout: main_guide
title: Start of the guide
description: "Start your journey to building your first Ruby on Rails app here!"
permalink: start
---
# Start of the guide
Welcome to the Rails Girls guides! In these guides you'll learn how to make an app using the Ruby on Rails framework (which is why this event is called _Rails_ Girls). When you have made your first app, you'll deploy it to a hosting service so that you can view it on the Internet and share it with others.
Please follow the numbered guides in order. Each guide assumes you followed the previous guide. When you're done with the workshop and/or completed all the numbered guides, feel free to explore the [other guides](/#other-guides) as well. Ask you coach for suggestions!
The first guides help you get set up with the tools you'll need and installing Rails on your machine. Use the __Guides__ list lower on this page to navigate your way to the next guide.
================================================
FILE: _pages/test-driven-development.md
================================================
---
layout: guide
title: Test Driven Development
permalink: test-driven-development
---
# Test Driven Development
*Written by Gregory McIntyre, [@gregmcintyre](https://twitter.com/gregmcintyre)*
This exercise is intended to teach you what we're talking about when we say
*Test Driven Development* (TDD).
## Background information
**Roman Numerals**
If you are not already familiar with Roman numerals, please read up
on [how Roman numerals work][Roman numerals] before continuing.
In summary, here are some examples of how Roman people wrote numbers:
| Hindu-Arabic | Roman |
|---|---|
| 1 | I |
| 4 | IIII (or IV) |
| 5 | V |
| 6 | VI |
| 7 | VII |
| 9 | VIIII (or IX) |
| 10 | X |
| 50 | L |
| 100 | C |
| 500 | D |
| 1000 | M |
Run the following command in the Terminal app:
{% highlight sh %} brew install imagemagick {% endhighlight %}If you are on Ubuntu, run the following command in the Terminal app:
{% highlight sh %} sudo apt-get update sudo apt-get install -y imagemagick {% endhighlight %}Download and run the ImageMagick installer (use the first download link). In the installation wizard, make sure you check the checkbox to install legacy utilities.
Please consult your Linux distribution's documentation about how to open apps, and open the Terminal app.
You can verify that a directory named projects was created by running the list command: ls. You should see the projects directory in the output. Now you want to change the directory you are currently in to the projects folder by running:
You can verify you are now in an empty directory or folder by again running the ls command. Now you want to create a new app called railsgirls by running:
This will create a new app in the folder railsgirls, so we again want to change the directory to be inside of our rails app by running:
If you run ls inside of the directory you should see folders such as app and config. You can then start the rails server by running:
You can verify that a directory named projects was created by running the list command: dir. You should see the projects directory in the output. Now you want to change the directory you are currently in to the projects folder by running:
You can verify you are now in an empty directory or folder by again running the dir command. Now you want to create a new app called railsgirls by running:
This will create a new app in the folder railsgirls, so we again want to change the directory to be inside of our rails app by running:
If you run dir inside of the directory you should see folders such as app and config. You can then start the rails server by running:
| <%= place.picture %> | {% endhighlight %} to {% highlight erb %}<%= image_tag place.picture_url(:thumb) if place.picture? %> | {% endhighlight %} Take a look at the list of ideas in the browser to see if the thumbnail is there. ================================================ FILE: _pages/touristic-autism_intro.md ================================================ --- layout: guide title: Touristic Autism-friendly Spots App permalink: touristic-autism_intro --- # Rails Girls Touristic Autism-friendly Spots App Tutorial *Created by Myriam Leggieri, [@iammyr](https://twitter.com/iammyr)* *for [Rails Girls Galway](https://github.com/RailsGirlsGalway)* This guide merges, adapts and extends some of the basic RailsGirls guides **for the scenario**: description, displaying and commenting touristic places and rate them with respect to their autism-friendliness. This application was requested by the [Galway Autism Partnership](https://galwayautismpartnership.com/) to support autistic adults during their travelings. The extension comprises of the following **new features**: * TDD using Guide * Resource Rating * Authenticated User (via devise) permission setting The basic guides that have been merged and adapted are the [Ruby on Rails Tutorial](https://www.railstutorial.org/book), the [basic RailsGirls app](/app) and the tutorials for [creating thumbnails](/thumbnails), [authenticating users](/devise), [adding design](/design), [deploying to OpenShift](/deployment/openshift) and [adding comments](/commenting). ### [*0.* Installation](/install) **Make sure you have Rails and Git installed.** [**Follow the installation guide**](/install), the [**Installing Git section of Pro Git**](https://www.git-scm.com/book/en/Getting-Started-Installing-Git) to get set up. Then configure GitHub by typing the following in your terminal: {% highlight sh %} git config --global user.name "Your Name" git config --global user.email your.email@example.com {% endhighlight %}<%= link_to 'Edit', edit_place_path(place) %> | <%= link_to 'Destroy', place, method: :delete, data: { confirm: 'Are you sure?' } %> | {% endhighlight %} with {% highlight sh %} <% if user_signed_in? %> <% if current_user.id == place.user_id %><%= link_to 'Edit', edit_place_path(place) %> | <%= link_to 'Destroy', place, method: :delete, data: { confirm: 'Are you sure?' } %> | <% end %> <% end %> {% endhighlight %} That's it. Now view a user you have inserted to your application and there you should see the form for creating a place as well as deleting older places. ## Place's Comments Just as well as we created a "place" resource and associated it with users, we can create a "comment" resource and associate it with places 9and with its author).