julia + Genie ② - ディレクトリ構成・開発準備など

公開日:2019-02-27
最終更新:2019-02-27
※この記事は外部サイト(https://gasekao.com/julia-genie-directory/)からのクロス投稿です

開発に使う(予定の)ツールなど

  • Atom v1.34.0
  • ターミナル
  • Postman(APIを確認する時)

Atom - julia + Genie のために新しく入れたパッケージ

  • language-julia
  • julia-client

Genieのディレクトリ構成

├── ProjectManagement.jl    <- 作成したアプリの名前に準拠して作成  
├── app  
│   ├── assets  
│   │   └── ~ [アプリに使う外部ファイルを置く]   
│   ├── layouts  
│   │   └── app.jl.html    <- htmlの大枠  
│   ├── resources  
│   │   └── ~ [ここにモジュールを作っていきます]  
├── bin  
│   ├── repl  
│   └── server    <- Genieの起動  
├── config  
│   ├── database.yml    <- DBの設定ファイル?  
│   ├── env  
│   │   └── ~ [各環境のための設定ファイル]  
│   ├── initializers  
│   │   └── ~   
│   ├── routes.jl    <- router  
│   └── secrets.jl    <- アプリのトークンが書かれている  
├── lib  
├── log  
│   └── ~ [アプリのログが格納される]  
├── package.json    <- おなじみの  
├── public  
│   ├── css  
│   │   └──[色々なcss]  
│   ├── error-404.html    <- Not findのページ  
│   ├── error-500.html     <- エラー時に表示されるページ  
│   ├── fonts  
│   │   └── [色々なフォント]  
│   ├── img  
│   │   └── [色々な画像]  
│   ├── js  
│   │   └── [色々なJavascript]  
│   ├── robots.txt    <- 標準装備  
│   └── welcome.html    <- 最初期のindexに表示されているhtml  
└── webpack.config.js

全部treeしたらすごく長くなったのでかなり省略しましたが、おおよそ開発で触るファイルや、把握しておきたい設定ファイルはこのような感じです。
今回の開発では、GenieではAPIしか吐き出さない予定なので asset のディレクトリなんかは削除して軽くする予定です。

先頭の ProjectManagement.jl は、CLIでアプリを作成したときにつけた名前をキャメルケースにして作られたファイルです。
(これから開発にあたって各ファイルを触るので、後ほどアップデート予定)

開発で触る部分

開発する時に、主に触るであろう部分を見ていきます

app

- assets

大体のWebフレームワークでもそうな通りに、アプリで使う外部ファイルを置く場所です。最初から css, fonts, js のディレクトリとそれぞれにファイルがあります。
今回作るアプリは、GenieではAPIを吐き出すだけなので、開発に入ったら削除する予定です。ビルド時とかにこの階層の中も見てるようだったら、遅くなってしまうので。

- helpers

いわゆるviewのヘルパーですね。
フォームバリデーションのヘルパーと、flashのヘルパーが初めから入っていました。こちらも開発に入ったら消す予定。

- layouts

viewのレイアウトのためのファイルを置ける場所です。初期段階では、

<!DOCTYPE html>  
<html lang="en">  
  <head>  
    <meta charset="utf-8" />  
    <title>Genie :: The highly productive Julia web framework</title>  
    <link rel="stylesheet" href="/css/bootstrap.css" />  
    <link rel="stylesheet" href="/css/application.css" />  
  </head>  
  <body>  
    <%  
      @yield  
    %>  
    <!-- <script src="/js/application$(Main.UserApp.ASSET_FINGERPRINT).js"></script> -->  
  </body>  
</html>

が書かれた app.jl.html が入っていました。juliaのviewファイルは XXX.jl.html のようです。
@yieldの部分にコンテンツが表示されるのがわかりますね。
ここで読み込まれているcssファイルは、publicのディレクトリのcssです。

- resources

初期ではこの中には何も入っていませんが、これから開発を進めるにあたって、各モジュールたちはこの中に作成していきます。
公式のドキュメントで

Adding your code to the routes.jl file or placing it into the lib/ folder works great for small projects, where you want to quickly publish some features on the web. But for any larger projects we’re better off using Genie’s MVC structure. By employing the Module View Controller design pattern we can break our code in modules with clear responsabilities. Modular code is easier to write, test and maintain.
Genie - WORKING WITH RESOURCES

とあり、コンパクトなアプリであれば routes.jl に記述したり、lib にファイルを置いてもいいようですが(むしろ推薦?)、大きなアプリであれば、MVCパターンを採用しするのがお勧めとのこと。

A Genie app is structured around the concept of “resources”. A resource represents a business entity (something like a user, or a product, or an account) and maps to a bundle of files (controller, model, views, etc).
Genie - WORKING WITH RESOURCES

Genieは、「リソース」というコンセプトを採用しているらしいく、Genieのいう「リソース」とは、ビジネス的な考えのもとで分けれる各グループ(ユーザー、製品、アカウントなど)みたいなので、開発規模によってかなりの数のディレクトリができそうですね。
MVCで開発をしたことがある人には、特に違和感のないWebフレームワークの概念だと思います。

Genieの公式ドキュメントに乗っ取って、本のリソース・Bookで作ると、resources の中身はこのような構成になります。

resources  
└── books  
    ├── BooksController.jl  
    └── views  
        └── books.jl.html

BooksControllerにモジュールを作成していきます。
以下はGenieの公式ドキュメントのキャプチャ。

後々開発に着手したら自分のモジュールも公開できたらと思います。

データ型の宣言が struct なあたり、とてもC言語ですね。
普段scalaづかいの私には、とても新鮮です。

routes.jl

routeを記述していく部分ですね。
初期では

using Genie.Router: @params  
using ProjectsController  
using Genie.Renderer  


route("/") do  
  serve_static_file("/welcome.html")  
end

のみ記述されていて、ここが起動時のwelcome画面です。
この welcome.html は、public フォルダに入っているので、静的なhtmlを表示する場合はこの記述方法で問題なさそうですね。

今回はここまで

この2つがあれば、ひとまず色々動かせるので、今回はここまでです。
次回は実際にJSONでデータを吐き出せたらと思います。

データベースまで繋げられたらいいな。

おまけ

公式ドキュメントを翻訳・要約してると、どこまで単語をカタカナのままで採用し、どこから日本語に直せばいいのか判断つかない時があるんですが、Google翻訳はその辺とても良い。

記事が少しでもいいなと思ったらクラップを送ってみよう!
18
+1
技術メモなど。

よく一緒に読まれている記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう
目次をみる

技術ブログをはじめよう

Qrunch(クランチ)は、ITエンジニアリングに携わる全ての人のための技術ブログプラットフォームです。

技術ブログを開設する

Qrunchでアウトプットをはじめよう

Qrunch(クランチ)は、ITエンジニアリングに携わる全ての人のための技術ブログプラットフォームです。

Markdownで書ける

ログ機能でアウトプットを加速

デザインのカスタマイズが可能

技術ブログ開設

ここから先はアカウント(ブログ)開設が必要です

英数字4文字以上
.qrunch.io
英数字6文字以上
ログインする