arakawatomonori / senro Goto Github PK

View Code? Open in Web Editor NEW

0.0 7.0 0.0 2.09 MB

Ruby 67.18% JavaScript 8.87% CSS 1.69% HTML 20.28% Shell 0.46% PowerShell 0.56% SCSS 0.96%

senro's Introduction

README

セットアップ方法

Macの場合

Terminal.app を起動する
senroディレクトリに移動する
./scripts/setup-macos.sh と実行する

Windows10の場合

Windowsボタンを右クリックしてPowerShellを管理者として起動
Set-ExecutionPolicy Bypass と実行する
senroディレクトリに移動する
./scripts/setup-windows.ps1 と実行する

起動方法

bundle exec rails server

ブラウザで見る方法

テスト方法

bundle exec rubocop
bundle exec rake db:migrate RAILS_ENV=test
bundle exec rake

データベース更新方法

bundle exec rake db:migrate

Railsの基本的なディレクトリ構造

(Articleという名前のModelがあったときの例)

https://ja.wikipedia.org/wiki/Model_View_Controller https://www.javadrive.jp/rails/ini/index7.html

app/ Railsアプリケーションのソースコードが入っているディレクトリ
- controllers/ Controllerの入っているディレクトリ
  - articles_controller.rb
- models/ Modelの入っているディレクトリ
  - article.rb
- views/ Viewの入っているディレクトリ
  - layouts/
    - application.html.erb
  - articles/
    - _form.html.erb
    - edit.html.erb
    - index.html.erb
    - new.html.erb
    - show.html.erb
config/ 設定ファイルが入っているディレクトリ
- routes.rb RailsアプリケーションとURLの対応付けを定義している設定ファイル
db/ データベース関係のファイルが入っているディレクトリ
- migrate/ データベースマイグレーションのためのファイルが入っているディレクトリ
  - 20YYMMDDHHMMSS_create_articles.rb
- schema.rb
test/ テスト関係のファイルが入っているディレクトリ
- controllers/
  - articles_controller.rb
- fixtures/
  - articles.yml
- models/
  - article_test.rb

参考にしているテキスト

https://railsguides.jp/getting_started.html

使ったコマンド

gem install rails
rails new senro
cd blog
rails generate controller Welcome index
rails generate controller Articles
rails generate model Article title:string text:text
rails db:migrate

編集した箇所

app/stylesheets/welcome.scss
app/controllers/welcome_controller.rb
app/controllers/articles_controller.rb
app/views/welcome/index.html.erb
app/views/articles/index.html.erb
app/views/articles/new.html.erb
app/views/articles/show.html.erb
app/config/routes.rb

メモ

動いた Ruby version
- ruby 2.6.3p62 (2019-04-16 revision 67580) [x64-mingw32]

senro's People

Contributors

Watchers

senro's Issues

git remote add origin [email protected]:arakawatomonori/senro.git

git remote add origin [email protected]:arakawatomonori/senro.git
git checkout -b "my-branch"
git push -u

Bootstrapで見た目を整える

https://getbootstrap.com/docs/4.3/getting-started/introduction/ に従う
app/views/layouts/application.html.erb の <head></head> に以下を加える

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" crossorigin="anonymous"></script>

https://getbootstrap.com/
https://getbootstrap.com/docs/4.3/content/reboot/
https://getbootstrap.com/docs/4.3/components/

http://www.tohoho-web.com/bootstrap/introduction.html

rails generate modelを試す

手順

現実に存在する概念を考える（例：ビル）
その概念の英語名・単数形を調べる（例：Building）
その概念の属性を考えて英語名を調べる（例：高さ→height）
その属性はどんな種類の値か考える（例：高さは数→integer）
コマンドを組み立てる
このissueのコメント欄でコマンドを確認する
VSCodeのTerminalで実行する
branch を立てて commit して push する

属性の種類

string : 文字列
text : 長い文字列
integer : 整数
float : 浮動小数
decimal : 精度の高い小数
datetime : 日時
timestamp : タイムスタンプ
time : 時間
date : 日付
binary : バイナリデータ
boolean : 真偽値

コマンドを組み立てる

rails generate model 概念の英語名属性:種類属性:種類 ... という規則でコマンドを組み立てる

例：

rails generate model Building name:string height:integer address:string
rails generate model Person name:string twitter:string mailaddr:string

vscodeに拡張をインストールする

インデントがズレていたり全角スペースが混じっていたりするのはよくないので対策する

インデントブロックを見やすくしてくれるやつ

https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow

全角スペースを見やすくしてくれるやつ

https://marketplace.visualstudio.com/items?itemName=mosapride.zenkaku

スペルミスを発見してくれるやつ

https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker

rails generate model Milestone

手順

現実に存在する概念を考える
- 歩いた距離に応じた場所を保存したい
その概念の英語名・単数形を調べる
- マイルストーンの英語名：Milestone
その概念の属性を考えて英語名を調べる
その属性はどんな種類の値か考える（例：高さは数→integer）
- 場所が持つ属性
  - 名前：name:string
  - 距離：distance:integer
  - 写真：photo_url:string
コマンドを組み立てる
- rails generate model Milestone name:string distance:integer photo_url:string
- rails generate controller Milestone