• ベストアンサー

Web開発は何を学ぶべきでしょうか

m_matsubaraの回答

  • ベストアンサー
回答No.4

現在の案件で普通にWebデザイナさんとしてやっていくには、既に基本は覚えている状態のようですね。 質問の内容から察するに、フロントエンドエンジニアとしてやっていきたいように見えていますので、その前提でお話をさせていただきます。 あなたの現在の状態がわかりませんが、学生さんであれば自分で好きな技術を選別してサイトを作っていく、社会人としてその技術を活用しているなら、現在の案件に合わせて必要な技術を入れていく通路を辿っていけば良いのではないでしょうか? Webの世界は技術進歩が早いので特定のクライアントサイドの技術を習得しても、数年後にはトレンドが変わってしまうものなのですし、作られるサイトに応じてその選択肢は変わります。 例えば、ブログザイトに若干の動的な部分をつけたい場合は、AngularJSの様な大掛かりな仕掛けは読み込み速度低下を嫌って使われず、jQueryをどうやって高速に読み込ませるかに心血を注いでいたりします。 また、質問内容にある様なJSの世界は、文化的にプログラマの自由に寄った民主主義の文化があって2~3年するとイケてるフレームワークの名前が変わりますので、"今"イケているフレームワークを勉強しても、もらった案件が3年前に開始されたものであれば、勉強したものとは違うフレームワークが使われているでしょう。 上記の理由から、特定の技術を勉強しても案件で生かせる"打率が良くない"ので、もらった案件に合わせるのが一番効率的な選択肢になります。 そこをあえて棚に上げてフロント系のおすすめの回答をするなら、SCSS、AngularJS、TypeScriptでしょうか。 理由は、AnguarJSは細かいカスタマイズは効きづらいですが、リッチなページを作るのに必要な技術が一通り入っているのでこういう機能があるというのを体験しやすいので。 TypeScriptは今の所のAltJSの本命でその上でECMAScript6の機能の体験版として使えるからです。 SCSSは案件で生かしやすい技術ですが、JS関連技術は勉強しても実案件で活かせないかもしれません。 そこはご理解お願いいたします。

ques9900
質問者

お礼

ご回答ありがとうございます。 仕事では指定されている場合は、粛々とこなすので 決まった事には従う派です。 あまりにひどいと愚痴に出てしまうかもしれませんがご愛嬌です(汗) 普段は楽ちんなサーバ側で、フロントエンドは人手が足りない時のお手伝いです。 クライアントは対象環境が多くて大変なのに、なぜかあなどる人が多くていつも オンスケで終わらないんですよね。 この質問の内容は自分で全て管理している開発に適用するつもりですので、 気兼ねなく新しい事を取り入れようと思っております。 SCSS、AngularJS、TypeScript興味ありありです。 Javascriptの継承がどうも好きになれませんで、 ES6を心待ちにしております。 AltJS初耳でした。調査する事が増えて嬉しいです。 「jQueryをどうやって高速に読み込ませるかに心血を注ぐ」は C使いとしては胸熱です(笑) Javascriptの基本が解っていないので、 DOMのプロパティにほとんど全ての内部データを読み書きするようにしてしましました。 処理コストやセキュリティを考えるとダメな気がしています。 表示と内部データのズレが厄介なバグになりそうと思い内部にデータを 持たない方針にしたのに無理があった気がします。 こういうのが厄介なので、データバインディングやMVCという事が叫ばれているのかなと 勝手に想像しておりました。 データ書き換えとDOM反映がセットになってしまうと非効率な処理もあると思いますので、 分離しているのが、AngularJSやReact.jsなのかなと勝手に思っています。 現状のトレンドがどの地点にあるのかを、幅広いご意見から探りたいと思ったしだいです。 まったく理解はしておりませんが「Web Components」という言葉も気になっております。 貴重なご意見の数々、勉強になりました。

関連するQ&A

  • CSS含めてアップロードしても反映しない。

    デスクトップ上でwebサイトをTwitter bootstrapのフレームワークを使いながら構築しました。ローカル上は何の問題もなかったのですが、サーバーにアップロードした途端に、CSSや画像の読み込みがされなくなってしまいました。 The results here may be inaccurate because some stylesheets could not be loaded due to access restrictions. というようなメッセージがfirefoxで確認されました。 ディレクトリ構造は、下記のような感じです。 index.html bootstrap/css bootstrap/js bootstrap/img 実際のindex.htmlのヘッダー (ちなみにhtml5の記法に従ってます。) <head> <meta charset="utf-8"/> <title>Twitter bootstrap practice</title> <link href="bootstrap/css/bootstrap.css" rel="stylesheet"/> <script src="bootstrap/js/jquery.js"/></script> <script src="bootstrap/js/bootstrap.min.js"/></script> <style type="text/css"> body{padding-top:40px} </style> </head> なぜかさっぱりわかりません。 教えてください。 よろしくおねがいします。

    • ベストアンサー
    • CSS
  • JQueryはもう古いのですか?

    Webデザインの勉強をしていて、HTML5とCSS3をようやく覚えてきたのでJQueryを習おうかと思ったのですが、周囲からは「これからの時代はVue.jsだ」と言われました。そもそもJavaScript自体おろそかなのにこんな事を質問するのもおかしな話ですが、実際のところ、現場ではJQueryからVueへの移行が顕著なのでしょうか?今更JQueryを勉強するのは得策ではないのでしょうか? 分かりやすい回答をお待ちしております。どうぞ宜しくお願い致します。 OS Windows10

  • droppyとslideshowの共存

    jQueryについて質問です。 droppy.js(http://www.css-lecture.com/log/javascript/jquery-droppy-menu.html)と slideshow.js(http://www.css-lecture.com/log/javascript/039.html)を同じページに組み込みたいのですが、同時にいれると、slideshow.jsは動きますが、droppy.jsが動かないのです。 javascript初心者ですので、簡単に改善できる方法がありましたら、 どなたか教えてもらえますでしょうか。。 よろしくお願いします。

  • サーバ側とクライアント側のjavaScript

    「サーバサイドでjavascriptを実行させる」というのはどういうことなのでしょうか? node.js や、 イントラマートを使っているときは、 サーバサイドでのjavascriptというのも 全然理解できるのですが、 それらの基盤を使用していなくても、 サーバサイドの処理に、javascriptを使うことができるのでしょうか? 基本、jspの上の方に、 「サーバ上にあるjavascript」が クライアントサイドで動くと捉えており、 そういう意味では、基本、javascriptはクライアントサイドで動くと捉えているのですが違うのでしょうか? ※java+jspで実装しています。 .

  • 99limeの使い方がわかりません。助けてください

    私は、Webサイトを作るとき、デザインが苦手で、 bootstrapのCSSフレームワークを使っておりました。 いろいろな物を使ってデザインを試してみたいと思い、 99limeなどをダウンロードしたのですが、使えないのです。汗 全くわからず、ここ三日程、調べているのですが、うまくいかなくてお手上げ状態なのです。 例えば、99limeなどのサイトではもちろんのこと、Web内を調べてもこのような初歩的なことに対して、記述してある記事がなかったので、質問させてください どうすれば、99limeをhtmlに記述してWeb上で使用することができるのか 教えていただけませんか? 以下現在の私の理解度具合です。 bootstrapの場合ですと、html内において、<head>では <link href="css/bootstrap.min.css" rel="stylesheet"> そして、<body>の最後、すなわち</body>の付近に <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script> <script src="js/bootstrap.min.js"></script> と記述することで、bootstrapを使用することができました。 この方法はドットインストールという初学者のために公開された動画で解説されたものを そのまま使ったので、bootstrapを使うことができました。 動画添付でも、画像添付でも本当に困っておりまして、どなたか教えてください。 よろしくお願いします。                         

    • 締切済み
    • CSS
  • jquery lightboxを設定しようとしていますが問題がでてます

    jquery lightboxを設定しようとしていますが問題がでてます.... functionの部分を htmlに直接表記すれば動く状態ですが、 functionの部分を外部に登録するとなぜか動かなくなってしまいます。 jquery.lightbox-0.5.min.jsというファイルにファンクションを書き足せばいいとの ことですが.. なにか 以下のHTMLソースに足らない部分がありますか? ご教授ねがいます。 <link href="css/top.css" rel="stylesheet" type="text/css"> <link href="css/print.css" rel="stylesheet" type="text/css" media="print"> <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> <script type="text/javascript"> $(function() { $('.up_image a').lightBox({ overlayBgColor: '#FFF', overlayOpacity: 0.7, txtImage: '画像', txtOf: 'の' } ); }); </script> </head>

  • JSについて

    フロント>サーバサイドも多少>5年後以降には将来はアプリ制作も考えたいと思っています。 HTML5>CSS3>jQueryとやってきたのですが、その後どう学んでいくか迷っています。 JSそのものの基礎は必須ということで、下記本のJSの部分は全部やろうと思っています。JSそのものの基礎の学習としては十分でしょうか? よく、ライブラリを使うにしても、将来も普遍的なプログラミングの基礎は、生のJSで行わないといけない、その後ライブラリ、フレームワーク、タイプスクリプトを 行うべきだと聞くのですが、下記本のJSの部分がそれに該当すると考えてよろしいでしょうか? よくわかるJavaScriptの教科書 単行本(ソフトカバー) – 2012/3/24 たにぐち まこと (著) 下記サイトで言えば、 初級者の基礎知識 第一章 オブジェクト 第二章 DOMの基礎 第四章 文字列の基本と正規表現 くらいで十分でしょうか? http://uhyohyo.net/javascript/ その後どうするかがわかりません。 候補は下記ですが、 ・リアクト ・メテオ ・タイプスクリプト リアクト、タイプスクリプトはメテオのように、フロントも、サーバサイドも、アプリ製作もできないですよね。 フロント、サーバサイドのみでしょうか? それとも、タイプスクリプトは、ただのメタ言語のようなものなので、サーバサイドもできないでしょうか? また、難易度でいうと、メテオはmysqlは使えずmongoDBでないと使えず、日本語の情報が少ないので一番高いでしょうか? また、ライブラリやフレームワークはころころ変わるので、将来無意味になってしまう可能性が高いので、JSそのものを行わないと、技能として残らないという話もありますが、 JSそのものないしはタイプスクリプトで行わないと、変わってしまった場合に技能として、残るものがないでしょうか? それとも結局メテオなどをやっていればJSそのものを自然に突き詰めていっていくので、 ほかのフレームワークなどに変わっていっても、JSそのものと同じように技能は残ると考えていいでしょうか?

  • HTML+CSS+JSでのアプリ開発

    HTML+CSS+JavaScriptでAndroidやiOSアプリを作る事は可能だと聞いたことがあるのですが、ネイティブアプリとHTML+CSS+JSアプリとではできることにどのような違いがあるのでしょうか?僕が今作ろうと考えているのは募金アプリですので、ネイティブアプリだと募金額の30%取られてしまうのであればHTML+CSS+JSで行きますが、有料アプリを出す気は無いです。長期的な事を考えたらJavaから入る方がいいかもしれないですね。あとWebページを作りたいって訳じゃ無くて、募金アプリだったらどっちの方が良いかってこととネイティブに対してHTML+CSS+JSでする事にどういうメリットどデメリットがあるのかって事です。長くなってしまいましたが、ご回答頂けると嬉しいです。よろしくお願いします。

  • 複数jQueryの配置で干渉 設置位置

    Javascript事は全くわかりませんが、色々なプラグインとしてjQueryを利用しています。 ----------------- jQueryに干渉があったようで、正常に動作させたいのですが、疑問があります。 1サイト目(HTML 最下部に配置) <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> 正常に動作します。 2サイト目(HTML head内に配置) <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/abcd.js" type="text/javascript"></script> 正常に動作します。 上記の2サイトを合体させた:(HTML 最下部に配置) <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> <script src="js/abcd.js" type="text/javascript"></script> すると、 layout.min.jsに不具合がでるようです・・・ <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/abcd.js" type="text/javascript"></script> でも、ダメです。 <script src="vendor/jquery.min.js" type="text/javascript"></script> を <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> に変更してもダメでした。 tel.js内を、 jQuery.noConflict(); (function($) { $(function(){ を $j に変えたり、 jQuery に 書き替えてもダメでした・・・ そこで、以下のように移動しましたら動作しました。 (HTML header内に配置) <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/abcd.js" type="text/javascript"></script> (HTML 最下部に配置) <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> 上記のように、 HTML head部と、HTML 最下部に分けるのは、正しい方法なのでしょうか?

  • 同HTML内で2種のJ-Queryを使用したい

    複数のjQueryを使用し、タブメニュータイプのものと自動スライドショータイプのを 同じHTML内にいれようとしていますが、1つのみしか作動せずJavaScriptエラーがでてしまいます。 片方ずつで行うと作動するのですが、同じHTMLに2種組み込むとうまくいきません。 同じ質問があり参考にさせて頂いたのですが良くわかりません。 複数使う場合の記述方法があるということもサイトで知ってやってみたりしたのですがうまくできませんでした。 http://stacktrace.jp/jquery/with_other_lib.html 使用しているものは以下です。 -------------------------------------------- <!-- jQuery --> <script type="text/javascript" src='/js/J-Query/jquery-1.5.2.min.js'></script> <!-- ナビ --> <script type="text/javascript" src='/js/J-Query/jquery.color-RGBa-patch.js'></script> <script type="text/javascript" src='/js/J-Query/example.js'></script> <!--スライダー--> <script type="text/javascript" src="/js/J-Query/jquery.flexslider.js"></script> <script type="text/javascript"> $(function(){ SyntaxHighlighter.all(); }); $(window).load(function(){ $('.flexslider').flexslider({ animation: "slide", start: function(slider){ $('body').removeClass('loading'); } }); }); </script> <script type="text/javascript" src="/js/J-Query/shCore.js"></script> -------------------------------------------- <!-- ナビ --> グローバルナビで使用 参照元 http://css-tricks.com/examples/MagicLine/ の下の方です。 <!--スライダー--> スライダーで使用 参考元 http://flexslider.woothemes.com/ お手数ですがどなたか教えて頂けると幸いです。