GithubHelp home page GithubHelp logo

makaron212 / openfisca-shibuya Goto Github PK

View Code? Open in Web Editor NEW

This project forked from project-inclusive/openfisca-shibuya

0.0 0.0 0.0 475 KB

渋谷区のOpenFiscaコードです

License: GNU Affero General Public License v3.0

Shell 0.10% Python 66.66% TypeScript 29.32% CSS 0.33% Makefile 1.54% HTML 0.57% Dockerfile 1.47%

openfisca-shibuya's Introduction

OpenFisca Shibuya (非公式)

概要

渋谷区の子育て支援制度のシミュレーターです。
世帯の属性を入力すると、利用可能な制度と手当額が表示されます。

作成Webアプリ

OpenFisca Shibuya ホームページに作成されたWebアプリが公開されています。
mainブランチのソースコードがビルド・デプロイされています。
フロントエンド(React)はGithub Pages、バックエンド(OpenFisca)はGoogle CloudのCloud Runでビルド・デプロイされています。

環境構築・開発参加方法

0. 前提

  • GitHub にユーザー登録する
  • Visual Studio Code をインストールする

1. 自分のPCにDockerを使って開発環境を作る方法

  1. Docker Desktopをインストールして起動する。

  2. proj-inclusiveのOpenFisca Githubリポジトリを個人アカウントのリポジトリとしてフォークし、ローカル環境(自分のPC)にクローン(ダウンロード)する。
    フォーク・クローン・プルリクエストの流れ
    リポジトリのクローンはGithub desktop, Source treeなどのツールを使うのが簡単です。

  3. 自分のPC上にクローンしたOpenfisca-Shibuyaのルートディレクトリで、WindowsならPowershell、MacならTerminalを開く。
    以下の手順でフロントエンド・バックエンドの環境構築・起動を行う。
    環境は同時に複数起動できない。
    そのため、環境を変える場合は元の環境を停止してから新しく起動する。

    • フロントエンド・バックエンドを一括で環境構築・起動

      # docker環境を構築・起動
      docker-compose up --build
      # 「Ctrlキー+c」でdocker環境を停止
      
    • バックエンドのみ環境構築・起動

      # docker環境を構築
      docker build ./ -t openfisca_japan
      # docker環境を起動
      docker run -it --rm -p 50000:50000 -v "$(pwd):/app" -u user openfisca_japan
      # $(pwd)はDockerfileが存在するディレクトリの絶対パスで置き換える必要があるかもしれません。
      # docker環境を終了
      exit
      
      
    • フロントエンドのみ環境構築・起動

      # dashboardのディレクトリに移動
      cd dashboard
      # docker環境を構築
      docker build ./ -t openfisca_japan_dashboard
      # docker環境を起動
      docker run -it --rm -p 30000:30000 -v "$(pwd)/src:/app/src" -u user openfisca_japan_dashboard
      # docker環境を終了
      exit
      # 元のディレクトリに戻る
      cd ..
      
    • フロントエンドを起動している場合は http://localhost:30000/ をブラウザに打ち込むとフォームが表示されます。

  4. project-inclusive/OpenFisca-Shibuya の mainブランチにプルリクエストを送る。
    (参考)フォーク・クローン・プルリクエストの流れ
    このリポジトリ自体のフォーク元である「SnoozingJellyfish/OpenFisca-Yuisekin」リポジトリにプルリクエストを送らないよう注意してください。

2. (参考)GitHub Codespaceを使用する方法

Dockerを自分のPCにインストールする必要はありませんが、操作性はやや悪いです。

  • (このリポジトリ を自分の GitHub アカウントに Fork する | 既に Fork してる場合は Fetch upstream する(必須))
  • → Fork した自分のアカウントの側のリポジトリをブラウザで開き、緑色の「Code」ボタンをクリック
  • → 「Create codespace on main」をクリック
  • → 「Open this codespace in VS Code Desktop」をクリック
  • → ダイアログが数回表示されるので全部 OK っぽい方をクリック
  • → VSCode と GitHub を連携させるために認証が求められるので承認する
  • → VSCode で GitHub Codespaces に無事に接続できたら、動作確認のために、ターミナルで make を実行

これだけで全員同じ環境で開発できるようになるはず。料金は 2022-07-02 現在、無料です。

このリポジトリを GitHub であなたのアカウントへ Fork して、 git clone する

Fork したあなたのリポジトリで、GitHub Codespaces を起動して、Visual Studio Code で開く

Image from Gyazo Image from Gyazo

GitHub Codespaces で動作確認する

make

GitHub Codespaces で API サーバーとして動かす

make serve-local

開発方法

1. バックエンド

  • 事前準備
    バックエンドのdocker環境に入る。

  • テスト実行

    • 全てのテストを実行(2023/2/25時点でエラーになるため、下の「一部のテストを実行」で確認)
      make test
    • 一部のテストを実行
      openfisca test --country-package openfisca_japan openfisca_japan/tests/<実行したいテストファイル或いはディレクトリパス>
      上記コマンド実行時にテストファイル(~.yaml)を読み込みます。そのため、テストファイルのみ修正する場合はそれ自身を修正してコマンド実行すれば良いです。
  • 内部計算方法の修正
    openfisca_japan/variables/~.py等の計算方法を規定するファイルを修正する。
    以下のコマンドでビルドを行わないとテスト時に修正が反映されない。
    make build
    その後、上述のテストを行う。

  • テスト条件・結果を記載したCSVファイルから、yamlのテストファイルを自動生成する方法

    cd make_tests
    bash generate.sh
    

    上記コマンドで openfisca_japan/tests/generated 以下にyamlのテストファイルが作成される。
    そのテストファイルを上述の方法でテストする。

2. フロントエンド

  • ルートディレクトリで以下コマンドを打ち、フロントエンドとバックエンドのDocker環境を一括で起動する。
    docker-compose up --build

  • cd dashboard でdashboardディレクトリにて開発する。

  • http://localhost:30000/ をブラウザに打ち込み、ページを確認する。

その他の情報

project-inclusiveの開発方針やOpenFiscaそのもの等の情報は、本リポジトリのWikiに記載しています。

openfisca-shibuya's People

Contributors

yuiseki avatar snoozingjellyfish avatar masayo0121 avatar jqinglong avatar koichiro-shiratori avatar watarunishimura avatar minosys-jp avatar smellman avatar syuparn 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.