- 1. Railsで必要十分なAPI開発環境を整える(Docker + Rails + MySQL + OpenAPI + CircleCI)
- 2. 【悪戦苦闘】自社開発企業に入社してからの一年を振り返り、エンジニアに必要な要素を考える
- 3. SessionとCookie
- 4. Stimulus リファレンス: コントローラー
- 5. 【初心者向け】Next.js + Rails APIで認証付きCRUDアプリ作って学んだこと
- 6. 【個人開発】twitterの対抗サービスを作ってみた!
- 7. whereメソッドの基本的な使い方
- 8. 【ViewComponentシリーズ①】ViewComponentを導入すべき理由5つ【Rails】
- 9. テーブル設計書とER図を常に最新化して社内公開(CI/CD)
- 10. 【Rails6】5段階評価の星レビュー機能を実装する手順(raty.js)
- 11. Rails gemのアンインストールをする方法
- 12. 【Rails API】手動でコントローラを追加する方法【備忘録】
- 13. 【Rails】Bootstrapのnavbarで綺麗にログアウトリンクを表示する方法
- 14. AWSのデプロイで躓いた話
- 15. ActiveRecordのjoinsメソッドはシンボルの引数と文字列の引数で挙動が異なる
- 16. Javascriptの基礎
- 17. Goのlog.Fatalではプログラムが終了してしまう
- 18. GraphQLを活用したスキーマ駆動開発を体験した話
- 19. アプリ作成・GitHubへPushまでの流れ
- 20. コントローラーの作成_rails
Railsで必要十分なAPI開発環境を整える(Docker + Rails + MySQL + OpenAPI + CircleCI)
# はじめに
RailsでAPIを作るぞ!ってなった時にいつも行っているテストやリンターなどの導入手順を備忘録がてら記事にしました。
また、本記事ではRailsアプリケーション自体は最小限の構成で作成し、
なるべく小規模かつ開発に必要なツールは最低限導入しておくことを念頭においています。# 完成系
最初に完成系のrepositoryを上げておきます。
実際の実装が見たい場合は下記repositoryをご参照ください。https://github.com/sho-19202325/minimal_app
# 本記事で扱うこと
– dockerでmysqlをdbとする最小限のrailsアプリケーションを作成
– ヘルスチェック用endpointの実装
– テストツール(rspec)の導入
– リンターツール(rubocop)の導入
– API定義書、並びに関連ツール(OpenAPI, Swagger Editor, Swagger UI, committee)の導入
– CI(CircleCI)の導入
– CORSの設定
– JSON用テンプレートエンジン(jbuilde
【悪戦苦闘】自社開発企業に入社してからの一年を振り返り、エンジニアに必要な要素を考える
# はじめに
どうもこんにちはもきお([@mokio_50](https://twitter.com/mokio_50))です。早いもので未経験からエンジニア転職し1年が経ちました。なので今回は自社開発企業に入社してからの1年間を振り返り、エンジニアに必要な要素って何なのかを考えていきたいと思います。
自分自身の振り返りと自社開発企業での働く風景がどんなもんなのか少しでも感じてもらえたら幸いです。結構なボリュームになっているので何回かに分けて読んでいただいた方がいいかもしれません。
# 簡単な企業概要
イメージを持ってもらうために弊社のフワッとした企業概要を記載しておきます。
* 従業員200名前後
* 自社サービス4つ稼働中、来月より新サービス開発予定(Rails, React, TypeScript)
* 既存サービス:バックエンドRails、フロントHTML、CSS、JS、一部React
* データ分析でPython使用
* かなりDBのレコード数が多く検索が重くなるため、ところどこでElasticsearch使用# 1年間に完了したタスク数
まず1年間にこなしたタス
SessionとCookie
## はじめに
Railsでは“`devise“`という、それはそれは便利な認証機能用の“`gem“`がありまして、それに頼り切ってしまっていたため“`cookie“`がどうとか“`session“`がどうとかという根本的な理解ができていませんでした。
それが最近バレてしまったので、この機会に“`session“`と“`cookie“`についてまとめたいと思います。## Cookie
“`cookie“`は、ステートレスな“`HTTPプロトコル“`をステートフルにすることができる代物です。元来、HTTPリクエストはステートレスであるため、前後のリクエストとの関係を持つことはなく独立したものです。
なので、1つ前のリクエストの内容を引き継ぐみたいなことができません。これを解決するのが“`cookie“`です。
サーバーはリクエストがあると、以後同じ相手からのリクエストを特定するために“`set-cookie“`ヘッダーを付与してレスポンスを返します。
その後のリクエストでは、その“`set-cookie“`ヘッダーに指定された値を`
Stimulus リファレンス: コントローラー
:::note
この記事は[Google翻訳](https://translate.google.co.jp/)の結果を編集したものです。
:::https://stimulus.hotwired.dev/reference/controllers
コントローラーはStimulusアプリケーションの基本的な組織単位です。
“`javascript
import { Controller } from “@hotwired/stimulus”export default class extends Controller {
// …
}
“`コントローラーはアプリケーションで定義するJavaScriptクラスのインスタンスです。各コントローラークラスは`@hotwired/stimulus`モジュールによってエクスポートされた`Contoller`基底クラスを継承します。
# プロパティ
すべてのコントローラーはStimulusアプリケーションインスタンスに属し、HTML要素に関連付けられています。 コントローラークラス内ではコントローラーの以下にアクセスでき
【初心者向け】Next.js + Rails APIで認証付きCRUDアプリ作って学んだこと
# はじめに
Next.js + Rails API で個人 PF 作ろうと思っているので、React や TypeScript、Next.js を勉強しています。
この間、勉強の成果検証として、簡単な認証付き CRUD アプリを作りました。
機能はすごく簡単だけど、色々躓いたので、メモとしてまとめたいと思います。
※ この記事では主に Next.js 側についてまとめています。## この記事はこんな人におすすめ
– React の基礎知識があり、Next.js についても興味ある人。
– Next.js を使いたいけど、具体的なイメージがまだ詳しくない人。
– Axios や React Hook Form と React-toastify などのライブラリを使いたい人。
– Firebase の認証機能を使いたいけど、イメージがまだわからない人。## この記事で触れること
– Next.js を使う理由(React と比べてのメリット)
– Next.js で CRUD アプリを作る流れ
– バックエンドからデータ取得 (Axios, node-fetch)
【個人開発】twitterの対抗サービスを作ってみた!
# はじめに
最近イーロン・マスクがtwitterを買収してから、いろいろ騒がれていますよね。そんなtwitterから移行しようと考えてる人を拾おうと思い、[Ammot](https://ammot.net/)というSNSを開発しました(買収前から作り始めてたのは秘密)。https://ammot.net/
↑今回作ったSNS
Ammotは文字数制限が6000字まで、画像・動画・PDF・音声。テキストも同時に10個まで投稿可能です。
エロやグロ系も投稿可能です。![スクリーンショット 2022-12-18 020348.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/480294/681cfe1f-c3e0-4601-cfe0-03b5f8143467.png)
# 作った経緯
実はAmmotというSNSを作るのは初めてではありません。https://qiita.com/UTOG/items/d5e6194aaa31b54e97c9
一年半前に全く同じ名前、コンセプトでサービスを公開
whereメソッドの基本的な使い方
## はじめに
Qiita初投稿になります。
学んでいる内容で以下の記述の意味が全然わかりませんでした。
なので、今回は「whereメソッド」の使い方をメモします。“`ruby
@todays_date = Date.today
plans = Plan.where(date: @todays_date..@todays_date + 6)
“`
ちなみに「..」は”~”を指します。
つまり、 @todays_date..@todays_date + 6は「今日の日付(@todays_date) ~ 6日後までということらしいです。
## 基本の使い方
__モデル名.wher(カラム名: 条件)__
“`ruby
User.where(name: “ショウ”)
“`
これで「ショウ」という名前のユーザーのレコードを全て取得します。引数が一つの場合は他にも書き方があるそうですが、以下の2つの理由で上記のハッシュで記述するのが良いそうです。
1. 「SQLインジェクション」という悪意のある攻撃を防ぐため
2. 記述が楽なため## whereの他の使い方
【ViewComponentシリーズ①】ViewComponentを導入すべき理由5つ【Rails】
## 1. ViewComponentとは
再利用可能で、テストがしやすく、カプセル化されたビューコンポーネントを作るための**Railsの[gem](https://github.com/ViewComponent/view_component)**。
Reactから影響を受けた、Presenter(ViewのためのUIのビジネスロジックを書く)パターンの進化版。ざっくり言うと、フロントでは当たり前のように使われているコンポーネントの概念を、ViewComponentを使ってRailsのビューにも取り入れて、同じようなビューのコードをコンポーネント化させちゃおうというもの。
ここで「それなら既にRailsには[パーシャル](https://railsguides.jp/action_view_overview.html#%E3%83%91%E3%83%BC%E3%82%B7%E3%83%A3%E3%83%AB%E3%83%AC%E3%82%A4%E3%82%A2%E3%82%A6%E3%83%88)があるんだからそれ使えばいいんじゃないの?」という話になるが、どうやらView
テーブル設計書とER図を常に最新化して社内公開(CI/CD)
# 概要
私が自社で担当しているサービスには大量のテーブルが存在していますが、テーブル設計書はあったりなかったりかつ所々陳腐化しており、ER図に至ってはほぼありませんでした。
なので、テーブル設計書とER図を常に最新化して社内公開する仕組みを`GitHub Actions`と`SchemaSpy`と`Private GitHub Pages`を用いて作ってみました。
また、参考までに`GitHub Actions`のソースも掲載しておきます。## 環境
– データベース:MySQL(他製品でもソースを変えたらいけそう)
– ソース管理:GitHub
– スキーマファイル:Railsのstructure.sql(サービスコンテナ内のDBに対象テーブルと同等のテーブルを用意できたらOK)## 全体イメージ
テーブル設計書とER図を常に最新化して社内公開する処理は
新規作成した`設計書用リポジトリ`内で完結させ、`サービス用リポジトリ`への影響がないようにしてます。
![gaiyouzu.JPG](https://qiita-image-store.s3.ap-northeast-1
【Rails6】5段階評価の星レビュー機能を実装する手順(raty.js)
# 概要
* ユーザーが任意のitemに対して5段階評価機能の星評価(非同期通信)ができるように実装したので、その手順について記す。
* Userは、itemの詳細ページ(/show)にいくと、5段階評価の☆評価(0.5単位)とコメントを行い、レビューを送信する(/form)。
* トップ画面(/index)にitemが一覧化されており、itemごとに☆評価の内の総合評価の平均点(関数で切り上げ)が表示される。
* itemの詳細ページ(/show)にも、総合評価の平均点(関数で切り上げ)が表示される。# 前提
* Ruby on Rails6で実装。
* Rails 6.0よりJavaScriptの扱いが変わっているため、Rails5などを使っている方は、別記事の参照を推奨。
* raty.jsを利用して実装する。
* 参考にした記事:
* [Railsで「Raty」を使った星機能をつける](https://qiita.com/busitora2/items/5b59d1ea9e90c1b016b4)
* [[Rails]星評価の実
Rails gemのアンインストールをする方法
# はじめに
作成したアプリケーションをAWSでデプロイしようと進めていましたが、都合によりrenderでデプロイする方向に切り替えました。
無事にデプロイできたものの、ブラウザで確認すると、**保存はできているが画像の表示が上手くいっていない**状態になりました。(窓のアイコン?が出てきてしまう状態)
AWSにてバケットの作成を行なっていたので、そこら辺に問題ありかなと考え問題解決までの道のりを書き残したいと思います。# エラーの内容
保存した画像が表示されるページへ遷移したときに、ターミナルにて以下のエラーが出ました。“`ruby:ターミナル
ActiveStorage::FileNotFoundError (ActiveStorage::FileNotFoundError):
“`
原因は自分の中でなんとなくわかっていて、冒頭にも書きましたが、AWSでのデプロイ作業の途中でrenderでのデプロイに切り替えたことかなと考えました。
AWSでバケットの作成をするにあたり、画像をS3に保存するためにaws-sdk-s3をインストールしていました。
このgemをアンインス
【Rails API】手動でコントローラを追加する方法【備忘録】
1. api/v1/examples_controller.rb を作成
2. config/routes.rbにresourcesを追加(ルーティングを追加する)
3. index アクションなどを作成
4. http://localhost:3000/api/v1/examples?parameter=1
【Rails】Bootstrapのnavbarで綺麗にログアウトリンクを表示する方法
# 概要
* deviseを導入
* Bootstrapで”Navbar fixed”を導入し、ヘッダーで「マイページ」や「ログアウト」リンクを設置しようというところ# 困ったこと
* 以下HTMLだとリンクがヘッダー内で微妙に下にずれ、なぜか綺麗に表示されない。また、CSSもなぜか反映されない。
“`erb:_header.html.erb<%= link_to 'ログアウト', destroy_user_session_path, :method => :delete %> “`
# 解決方法
* aタグではなく、Railsで一般的に使われるlink_toで以下のようにclass指定したら綺麗に反映されました。
“`erb:_header.html.erb<%= link_to "ログアウト", destroy_user_session_path, method: :delete, class: 'nav-link
AWSのデプロイで躓いた話
## はじめに
私は某プログラミングスクールに通う初学者です。
学習を始めて数ヶ月経ちますが、まだまだ考えが足らなかったり、トンチンカンな行動を起こしていると思います。
自分が遭遇したエラーや問題解決をした記録として投稿します。## デプロイ
今日はAWSを使ってデプロイしたときのことを書きたいと思います。今回デプロイしたアプリケーションは、以前にデプロイしていたにも関わらず、色々あって(長いので割愛します)ブラウザで表示できなくなっていることに気づき、スクールのカリキュラムを見ながら作業を行いました。
EC2内でgit pull origin masterを行ったところ、
“`:ターミナル
From https://github.com/xxxx/アプリ名
* branch master -> FETCH_HEAD
Already up to date.
“`
このように返ってきました。
そのままユニコーン軌道コマンド
“`:ターミナル
bundle exec unicorn_rails -c config/unicorn.rb -E
ActiveRecordのjoinsメソッドはシンボルの引数と文字列の引数で挙動が異なる
先日微妙にハマってしまったRailsの小ネタです。
ActiveRecordは次のように`joins`メソッドを使って別のモデル(テーブル)をJOINすることができます。
“`ruby
Task.joins(:project)
“`また、`includes`メソッドなどはシンボルを渡しても文字列を渡しても同じ挙動になります。
“`ruby
# includesメソッドはシンボルでも文字列でも挙動は同じ
Task.includes(:project)
Task.includes(‘project’)
“`これと同じように`joins`も同じようにシンボルでも文字列でも渡せるよね?と思ったんですが、文字列だとエラーが出ました。
“`ruby
Task.joins(‘project’)
# Task Load (0.2ms) SELECT “tasks”.* FROM “tasks” project
# …/sqlite3/database.rb:152:in `initialize’: SQLite3::SQLException: no such t
Javascriptの基礎
# はじめに
javascriptについての基礎を忘備録として残す# 変数定義の方法
javascriptの変数定義は、原則3種類存在する。
– const
値が変わらない変数の定義を行う[例]
const sample = “おはよう”sample = “おはよう”
// 再代入NG →エラーが起こるconst sample = “おはよう”
// 再定義NG →エラーが起こるconsole.log(sample)
// => おはよう と出力される– let
値が変わる変数の定義を行う[例]
let sample = “おはよう”sample = “おはよう”
// 再代入OKlet sample = “おはよう
Goのlog.Fatalではプログラムが終了してしまう
# TL;DR
Go言語の例外発生時に下記のような処理を行うことがあると思います。
“`go
if err := hogeFunction; err != nil {
// エラー処理
}
“`エラー処理のところでログ出力のために`log.Fatal(err)`を使っていたところ、意図せずプログラムが終了してしまいました。
処理を継続したければ`log.Print(err)`を使うのがよさそうです。# 解決したい課題
Ruby on RailsのRakeタスクから、別のRuby on Railsアプリケーションにリクエストを送り、Goのコードを実行して外部のAPIを呼び出すシステムを構築をしていました。
(1) Ruby on Rails
↓ GraphQLにてリクエスト
(2) Ruby on Rails
↓コマンド実行
(3) Go
↓リクエスト
(4) 外部API実行するRakeタスクについてはもとのRuby on Railsにある`Category`モデルのフェッチ対象を抽出する処理が書かれています。`ApiClient.new.request_t
GraphQLを活用したスキーマ駆動開発を体験した話
# 概要
会社でGraphQLを導入するにあたり、スキーマ駆動開発を取りいれた開発を行ってみました。
実際にどのような開発を行ったのか、またやってみてどうだったかをご紹介できればと思います。一度下記LTにて紹介した内容について少し加筆や修正を行った記事になります。
# GraphQLにおけるスキーマ駆動開発
GraphQLを導入する利点の1つとして「スキーマ駆動」が実現できることがあります。
スキーマ駆動開発についてはこちらのqsonaさんの資料が詳しいです。
GraphQLを構築する方法として、コードファーストとスキーマファーストの2つのアプローチがあります。
コードファーストは、APIのスキーマをGraphQLのコードで定義してスキーマを生成する方法です
アプリ作成・GitHubへPushまでの流れ
# 1.クラウド9でアプリを作成
下記コードでRailsアプリケーションのディレクトリが作成される
“`
rails new アプリ名
“`# 2.複数のホストから閲覧可能にする
rails sでサーバー起動してもエラーが発生するため、下記コードで閲覧可能にする
“`ruby:/config/enviroments/development.rb
Rails.application.configure do
:
config.hosts.clear #追記
end
“`# 3.GitHubにPushする
1.ローカルリポジトリを作成する
“`cloud9:cloud9
git init
“`
2.GitHubでリモートリポジトリを作成する
3.ディレクトリ/ファイルの変更履歴を保存する
“`
git add .
git commit -m “[Start] アプリ名(例)”
“`
4.ローカルリポジトリとリモートリポジトリを紐づける
“`
git remote add origin リモートリポジトリURL
“`
5.masterブランチをmain
コントローラーの作成_rails
# コントローラー作成する
:::note info
info
ターミナルにて作成したいアプリのディレクト内に移動している事が前提です。
:::
:::note warn
warn
以下のコントローラー名の命名規則は **複数形**を使用します。
:::“`
[terminal]
rails g controller [コントローラー名]
“`