質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.51%

  • JavaScript

    16501questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • jQuery

    6732questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • React.js

    837questions

    Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

  • Vue.js

    702questions

    Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

  • Angular2

    174questions

javascriptでサイトビルダーを作りたいがフレームワークなのかライブラリなのかアドバイスをお願いします

受付中

回答 2

投稿 編集

  • 評価
  • クリップ 1
  • VIEW 346

wieee

score 3

Drag & Dropで要素を並べてhtmlを構築しているサイトビルダーのWebサービスが多いので勉強として似たようなものを作ってみたいと思っています。
しかし昨今のjavascriptフレームワークの登場とjavascriptの新バージョンでどれを使えばいいのかわかりません。

現状の自分のスキル
javascript, jQuery, CoffeeScript
※javascriptのフレームワークは未経験です

上記スキルでサイトビルダーを作れます。といいますか作った経験があります。
ですが、上記はフレームワークを使っていません。
jQueryはDOMをいじれるライブラリですし、比較的容易にサイト構築ができます。

別にこれでもいいのですがちょっと時代遅れ感が否めないので最近のjavascriptの最新バージョンやフロントエンドのフレームワークを使ったほうが良いのかアドバイスをいただければと思います。

 前提

ちなみに前提としては、

  1. htmlをDrag & Dropなどで構築できる
  2. 静的htmlを出力できる
  3. 逆にhtmlを読み込めば再編集ができる(重要)

 検討したいフレームワークについて

フレームワークにはAngular React Vueがあります。
大規模開発ではないのと学習コストの面でReactかVueを候補にしたいと思います。

 質問1.

まずお聞きしたい点として、どちらもカスタムタグでjavascriptでサイトを構築していくと思うのですが、フレームワークからhtmlを構築はできるけど、その構築したhtmlから再びフレームワークで再編集というのは可能なのでしょうか?
というのも、構築したhtmlの保存はその編集したhtmlをそのままデータとして持とうと思っています(前提の3.)。
ですので再編集するときはhtmlを読み込んで再びフレームワークで編集、という感じを想定しています。
jQueryなら可能なのはわかるのですがフレームワークでも可能なのかお教えください。

 質問2.

javascriptは何で書くのがよいのでしょうか?
ES5, ES6, TypeScript, CoffeeScriptがあります。
現状、もうES6で書くのがよいのでしょうか?それともフレームワークを使うならどのバージョンでやるかはもう決まっているのでしょうか?

 質問3.

静的htmlに出力するのは、様々なライブラリがあります。jQueryであればそのまま構築したhtmlを出力してしまえばいいのですがフレームワークになるとライブラリを使わないといけないという考えであっているでしょうか?また、ライブラリによってクセがあったり問題があったりするものなのでしょうか?

 質問4.

そもそもサイトビルダーを作る場合、jQueryでいいのか、それともフレームワークでやるべきなのか、ご見解をお教えください。
目的はhtmlを構築できればいいのはわかるのですが、フレームワークの存在というのがあり、時代的にフレームワークを使ったほうが勉強にもなるし後々のメンテが容易などいろいろメリットがあると思います。

以上になりますが皆様のご意見やアドバイスをお待ちしております。
どうぞよろしくお願い致します!

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

+3

jQueryで作れるならjQuery使えばいいのでは。
何を使うかは自分で決めるしかない。
他人の意見に流されて合わないものを使っても後からのメンテができなくなる。
勉強のためなら同じものを全部のフレームワークで作ってみればどれが合うかも分かるしちょうどいい。

今からAngular1で作られた何かのメンテはしたくない。もっと古いjQueryのほうがまだマシ。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/05/20 13:46

    ありがとうございます。
    学習時間は限られているためすべてのフレームワークを試すことはできませんが
    ご意見として伺いましたので有り難く参考にさせていただきます。

    キャンセル

+1

先に回答された方と同じスタンスですが、まずは試したほうが良いですね。
学習時間が取れないのであれば、お金を出して誰かに教えてもらったり、ハンズオンに出席したりをおすすめします。
一応、学習範囲を絞るための参考意見を述べます。

質問1.

Angularは分かりませんが、少なくともVueやReactのようなフレームワークは生HTMLの再編集は出来ないと思ったほうがよいです。
HTMLを直接扱わず仮想DOMを使っている、というのが理由です。
読み込んだHTMLを一旦オブジェクトに変換するなど、発想の転換が必要ですが、ここで悩むくらいならjQueryで良いでしょうね。

質問2.

今から新たに覚えるのであればES6かTypeScriptがおすすめですが、ES5でも問題ありません。

質問3.

フレームワークによらず、素のJavaScriptでのinnerHTMLで出力できると思いますよ。ライブラリは不要です。

質問4.

折角興味が出ているところだと思うので、フレームワークの勉強も頑張ってみて下さい。
ごく浅いチュートリアル程度であれば、VueもAngularもReactも、それぞれ半日かからないくらいで雰囲気はつかめると思いますよ。

時代がどうとかは気にしない方が良いです。新しいものを使って詰まっても誰も助けてはくれませんので。
身近に経験者がいるとか、いい本が出てるとか、そういうレベルでとりあえず何かに決めてしまえば良いです。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/05/22 10:10

    学習前ですがとても非常に参考になるご回答に感謝致します!
    ハンズオンなども利用してみたいと思います。

    質問1.
    やはり仮想DOMですよね。htmlを構築していくという一方通行的だろうなと感じておりました。無理にフレームワークでやろうとすると自分で再構築ロジックを作らないといけなく、そうするとフレームワークのバージョンアップなどの度に対応せざるを得ないですね。となるとほぼ完成しているjQueryが良いという結論になりますね。

    質問2.
    今の段階ではどれでも大丈夫なようですね。javascriptに関してはどのバージョンを使うか、またaltJSを使うのかいつも悩んでしまいます。

    質問3.
    素のjavascriptで出力できるのですね・・・!それは気づきませんでした。

    質問4.
    はい、フレームワークも勉強してみようと思います。必要になる技術ですしね。

    だいたい方向性がつかめましたので助かりました。
    とても良いアドバイスをありがとうございます!

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.51%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る

  • JavaScript

    16501questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • jQuery

    6732questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • React.js

    837questions

    Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

  • Vue.js

    702questions

    Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

  • Angular2

    174questions