Giter Club home page Giter Club logo

asoberu-web-app's Introduction

asoberu-web-app

アソベルは簡単に日程調整ができるアプリです! https://asoberu.herokuapp.com

スクリーンショット 2022-03-02 11 30 09

開発期間:約10日(2021/12下旬〜2022/1上旬) 開発時間:50時間程度?

フロントエンドはこちら

バックエンドはこちら 

*android版もあります https://github.com/Itaru-furukawa/Asoberu

モチベーション -より簡単に日程調整を行いたい-

  • L○NEやGoo○leカレンダーといった日程調整ツールはあるものの、登録が必要であったり、そもそも使いづらい!
  • アカウントの登録不要!軽い!直感的で簡単!な日程調整アプリを作成することで、この問題を解消する!

技術スタック

学内の演習でこのアプリを発表する予定だったため、開発期間はそれほど取れないことを想定した選定。そのため、それぞれ技術スタックとして持っているものを採用した。それぞれDockerにのっけて開発。

フロントエンド

Vue2を用いて開発。 コンポーネントライブラリのvuetifyを用いることで、短い期間ながらリッチなUIに仕上げたかったため。vuetifyにもvue3への対応があるとかないとか... Vuexの使用は無し(使えばよかた) 参考: https://vuetifyjs.com/ja/components/calendars/#section-30c930e930c330b02630c930ed30c330d7

バックエンド

Ruby on RailsのAPIモードで開発!
また、TDDの実践を行うことで、開発手法の優位性についての調査を行った。具体的には、下記のステップで開発を進めた

  1. APIの設計( URI設計や返ってくるJsonの形式 )を考える
  2. 設計に従ってAPIを叩くことを想定したテストを書く
  3. そのテストを実行して失敗させる
  4. railsのコントローラー(API)を書く
  5. 2で書いたテストを成功させる
  6. テストが通るままでリファクタリングを行う
  7. 1〜6を繰り返す

インフラ

Herokuにデプロイを行った(本当はAWSにのせたかったけどお金がかかるらしいので断念...)。DBはMySQLを無料で使えるという理由で、clearDBなるものを使用。 https://elements.heroku.com/addons/cleardb

テーブル構造

QuickDBD-export

所感・メモ

TDDを実践してみたメリットとしては次のようなことが挙げられる

  • リファクタリングの作業効率が上がったことを実感
    • リファクタリング後、curlコマンドを叩いて結果を見たり、APIツール(Postman等)を使用してレスポンスを確認するといった必要がなく、テストを実行するだけでよいためストレスが減った!
    • 定量的な結果はないが、先にテストを書くことで、テストコード自体が設計書となり、実コードの実装時間は減った!
      • これは具体的な実行シナリオと入出力例が体裁を保った状態であることが自然言語よりもより直感的なためと考えられる

デメリットとしては

  • 開発に時間がかかる
    • テストも書いてプロダクトのコードも書いて、となるとやはり時間が限られた中での開発は厳しかった
    • 現にミスもチラホラ..
    • テストシナリオは費用対効果を考えなければプロダクトの質をあげるどころか、開発時間ばっかり食ってしまい逆効果になり得る(匙加減が難しい)

これらを踏まえて、自分の結論としては、ウォーターフォール開発などの仕様変更が少ない環境ではかなり強力に使えそうだと感じた。 逆に、アジャイル開発やWebアプリケーションでの開発など、仕様がコロコロ変わるような開発環境だと不向きかも? 仕様が変わるたびにテストを直してプロダクトも修正して、となるとかなり時間も食うので、デメリットの方が大きくなってしまうのかなといった印象がある。

asoberu-web-app's People

Contributors

itaru-furukawa avatar

Stargazers

Yusuke Uchida avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.