かわいかわ

TECH::EXPERT55期@渋谷 教室でうまい棒食べてる人です。

かわいかわ

TECH::EXPERT55期@渋谷 教室でうまい棒食べてる人です。

最近の記事

TECH::EXPERT【HTML/CSS】flexbox,svgタグ等【84日目】

【学習内容】・HTML/CSSの考え方 ・flexboxの使い方 ・svgタグの扱い方 【HTML/CSSの考え方】現在、メルカリTOPページの実装を行っているのですが、サイトを模写するときに、Googleデベロッパーツールを使用してサイト内の構造を見ていると使用するタグの使い方や当てるCSS云々の前に正しくレイアウトを把握することの方が何倍も重要であると気付きました。 つまり、サイトデザインを見て、どのようなHTML構造をするべきかをイメージし、HTMLのブロックレベル

    • TECH:EXPERT【VScode】プルダウンメニューをマルチカーソルで効率よく書く【83日目】

      【学習内容】・プルダウンメニュー ・VScodeのマルチカーソル 現在、メルカリトップページ「カテゴリーから探す」のプルダウンのマークアップを行っており、ひとまず見た目だけ整える方向で開発を進めています。 ①親カテゴリにマウスオーバー ⇒ 子カテゴリ出現 ②子カテゴリにマウスオーバー ⇒ 孫カテゴリ出現 みたいな感じです。 これを実現するには「どの言語」の「どんな技術」を使うか、を考えなければいけません。 僕の候補としては2つの方法がありました。 ①「HTML・C

      • TECH::EXPERT【rails】ツリー構造(多階層構造)のカテゴリを作る【82日目】

        【学習内容】 ・階層型DBとは ・ancestryを使う ・seeds.rbの編集 【階層型DBとは】DBは大きく3種類に分類されます。 ①階層型データベース ②ネットワーク型データベース ③リレーショナル型データベース 今回は①について学習します。 ①階層型データベース 名前の通りデータを階層型に格納する仕組みをもったDBです。 データはツリー構造で表し、ある1つのデータが他の複数のデータに対して、「親子の関係」を持っています。 末端にあるデータにアクセスするため

        • TECH::EXPERT【DB設計】メルカリ開発【81日目】

          【学習内容】・キックオフ! 【開発状況(0日目・1日目・2日目)】・DB設計 ・デプロイ準備 【キックオフ!】先日メンバー発表がありついにアジャイル開発が始まりました。 僕のチームは5人体制(うち転職コース3名、フリーランス2名)で開発を進めていくことになりました。 チームメンバーは全員55期で、よくもまあこんなに優秀なメンバーばかり同じチームになったなあと実感しております。 ちなみに、僕はスクラムマスターとしてチームの諸々の調整を行っていくことになりました。 全

        TECH::EXPERT【HTML/CSS】flexbox,svgタグ等【84日目】

          【チーム開発】いよいよ始まるよ【80日目】

          ここ1週間はnote更新をお休みしておりました。 なにをしていたのかというとアニメ見たりサッカーを見たりしていた(つまり遊んでいた)のですが、基本的に読書は毎日続けていました。 読み進めていたRails本を読了した後、DB設計絡みの本を読んでいたのですが、読み物としてだいぶ面白くないということもあって見て見ぬフリをしていました。。 さて、明日からは最後の山場であるチーム開発が始まるのですが、チームの皆さんの足を引っ張らないためにHTML,CSS,JavaScript,R

          【チーム開発】いよいよ始まるよ【80日目】

          【Rails】Railsの全体像を理解する【79日目】

          【学習内容】 ・Railsの全体像を理解する 【Railsを取り巻く世界】また、RailsはRubyを以外に様々な言語で構成されており、いろいろな関連技術とともに利用することができます。 Railsに詰まっている様々な、ソフトウェア開発において「良い」とされている技術に大きな影響を受けています。 具体的には、「MVC」、「オブジェクト指向」、「自動テスト」、「RESTful」のような概念たち指します。 また、基本的な前提として、RailsはHTTPでクライアントとやり

          【Rails】Railsの全体像を理解する【79日目】

          【Rails】Rspecでテストコードを書く【78日目】

          【学習内容】 ・テストについて ・Rspec 【テストについて】 自動テストは、コードが変更されるたびに自動テストを動かしてエラーの有無を確認することで、コードに意図しない不具合や挙動変更が混入することを防ぐことができます。 プログラムが正しく動作しているかどうかを確認するプログラムを作り、それを実行して想定どおりの動作をしているかを確認をしているかを確認することを指します。 【テストを書くメリット】 十分な自動テストを備えるためには開発を進めるたびに開発した機能を確認

          【Rails】Rspecでテストコードを書く【78日目】

          【Rails】deviseを使わないログイン機能の実装【77日目】

          【学習内容】 ・ユーザーログイン機能の実装 ・アソシエーション他 【ユーザーログイン機能の実装】(1)Userモデルにadminフラグを追加する ユーザーが管理者かどうかを表すフラグを追加します。 $bin/rails g migration add_admin_to_users ■db/migrate/XXXXXXXXXXX_add_admin_to_users.rb class AddAdminToUsers < ActiveRecord::Migration[

          【Rails】deviseを使わないログイン機能の実装【77日目】

          【Rails】DBの制約,ログイン機能導入偏【76日目】

          【学習内容】・DBの制約他 ・ログイン機能(前編) 【DBの制約他】(1)NOT NULL制約を加える 現状、TaskleafのTaskモデルの属性の中に「名前(:name)」がなくても登録が出来るようになっているので、NOTNULL制約をつける事で、taskテーブルのnameをnull不可に変えます。 $bin/rails g migration ChangeTasksNameNoNull ■db/migrate/XXXXXXXXXXXXX_change_task

          【Rails】DBの制約,ログイン機能導入偏【76日目】

          【Rails】TECH::EXPERT【75日目】

          【学習内容】 ・タスク管理アプリの作成 後半 【タスク管理アプリの作成 後半】(1)コントローラーとビュー作成 コントローラー名だけ決めれば、テキストエディタからでも内容の記述はできますが、効率的に雛形をつくるには、アクションについて現段階から考慮する必要があります。 $bin/rails g controller tasks index show new edit このようにあらかじめ4つのアクションを定義しておきます。 (2)ルーティングの編集 (1)の方法で

          【Rails】TECH::EXPERT【75日目】

          TECH::EXPERT【面談】ドラゲナイ【74日目】

          【学習内容】ライフコーチ面談 【内容】今日はライフコーチと面談を実施しました。 テーマは、「自分にとって最高な転職はなんだ?」ということです。 具体的には、僕が定義する’理想的な転職’に実現に向けてのアクティブプランについてライフコーチに相談しました。 働くということまず企業選びの軸について、何を重要視するか確認を行いました。 僕が最も重要視したいのは、「企業理念に共感できること」です。 なぜなら、「社会」、「企業」、「自分」この3者がそれぞれ定義する「正義」に同

          TECH::EXPERT【面談】ドラゲナイ【74日目】

          TECH::EXPERT【Rails】予定管理アプリを作る【73日目】

          【学習内容】 ○Ruby on railsでCRUD機能を持つアプリを作る ・実行環境 ・scaffoldを使ったユーザー管理アプリの作成 ・タスク管理アプリの作成(Slim,Sass,Bootstrapの使い方)前半 【書籍】現場で使えるRUBY ON RAILS5速習実戦ガイド これまでは1から10までTECH::EXPERTのカリキュラムで指示された環境でなんとなく環境構築をして開発を進めてきましたが、今回は少し違う環境で開発を進めます。 CRUD機能を持つアプリ

          TECH::EXPERT【Rails】予定管理アプリを作る【73日目】

          TECH::EXPERT【jQuery】スライドショーBasic【72日目】

          【学習内容】 ・画像とキャプションの表現 ・見え隠れするサイドバー ・スライドショーを作る Basic 【画像とキャプションの表現】 HTML上に配置された画像にmouseoverしたときに、画像に被せる形で簡単な説明文を表示します。 □HTML <div id=”images”> <h2>IMAGES</h2> <div class=”inner clearfix”> <p><img src=”img/01_img.jpg”><strong>test1</stro

          TECH::EXPERT【jQuery】スライドショーBasic【72日目】

          TECH::EXPERT【jQuery】【71日目】

          【学習内容】 ・制御文 ・動きのある表現の基本 【制御文】○if文 複数の値を比較し、その結果によって処理を分岐する場合はif文を使用します。 条件式は( )で囲い、処理のあとには「;(セミコロン)」をつけます。 if( 条件式 ) { 条件がtrueの場合の処理 ; } else if, elseの場合の処理も同様です。 インテンドを工夫し、処理の内容を視覚的にわかりやすく書くとgoodだと思います。 var a = 100;var b = 200;var c

          TECH::EXPERT【jQuery】【71日目】

          TECH::EXPERT【jQuery】アニメーション、this、関数【70日目】

          【学習内容】 ・アニメーション ・thisの使い方 ・関数の使い方 ※一応jsファイルだけでも何をやっているかはわかりますが、HTMLのコードを読みたい方は69日目のnoteをご覧ください。 【アニメーション】■animate()メソッドの基本 ここではanimate()メソッドを利用してCSSが徐々に変化するような動きを加えていきます。 $(function)({ $(‘#typo’).on(‘click’, function(){ $(‘#typo .inne

          TECH::EXPERT【jQuery】アニメーション、this、関数【70日目】

          TECH::EXPERT【jQuery】基礎〜メソッドチェーンくらいまで割と丁寧に【69日目】

          先週から今週にかけて、珍しく仕事やら遊びのイベントやらで忙しく、今週はなかなか勉強時間が確保できませんでした。 最近は書籍を使用して学習を進めているのですが、これがなかなか良いです。 2週間くらいでのんびり1冊読むようなペースで進めているのですが、いい感じに飽きがきた頃に読み終わるのでちょうどいい感じです。 ということで、今週は若干苦手意識があるjQueryをやることにします。 【学習内容】・CSSのスタイルの変更 ・タイミングのコントロール ・アニメーション

          TECH::EXPERT【jQuery】基礎〜メソッドチェーンくらいまで割と丁寧に【69日目】