パリで発表されていたReact向けプロダクトがあまりにも未来に生きていて興奮したので、紹介させてください。 目次 目次 この記事のゴール 想定読者 はじめに 今回ベースとするソースコード React Nativeは何をするツールか Reactは何をするツールか React DOMとReact Nativeの違い Reactアプリケーションを描画するものたち React DOMの役割 React Nativeの役割 1. ネイティブ処理系の上でJavaScript処理系を動かす 2. Reactを動かす 3. Reactから渡された差分をネイティブViewに適用する React Native DOMはどこがReact Nativeなのか React Native DOMのやばいところ6連発 ReactからはReact Nativeに見えてるのがやばい Objective-C実装をJavaSc
Transcript 30代から始めるwebフロントエンド入門 コネヒトマルシェ #2〜webフロントエンド市〜 @itosho 1 ▪ 自己紹介 ・伊藤 翔 / @itosho ・所属:コネヒト株式会社 / Supership株式会社 ・野球とアイドルが好きです。 ・最近のオススメ:sora tob sakana 先日メジャーデビュー ▪ 自己紹介 ・伊藤 翔 / @itosho ・所属:コネヒト株式会社 / Supership株式会社 ・野球とアイドルが好きです。 ・最近のオススメ:sora tob sakana 先日メジャーデビュー ・主にサーバーサイドエンジニアをやっています。 ・よく書く言語:PHP / Ruby / Golang _人人人人人人人人人人人人人人_ > サーバーサイドエンジニア <  ̄Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y ̄ 4 ▪ 今日話すこと
PySpa統合思念体です。これからJavaScriptを覚えるなら、「この書き方はもう覚えなくていい」(よりよい代替がある)というものを集めてみました。 ES6以降の難しさは、旧来の書き方にプラスが増えただけではなく、大量の「旧来の書き方は間違いを誘発しやすいから非推奨」というものを作り出した点にあります。5年前、10年前の本やウェブがあまり役に立たちません。なお、書き方が複数あるものは、好き嫌いは当然あると思いますが、あえて過激に1つに絞っているところもあります。なお、これはこれから新規に学ぶ人が、過去のドキュメントやコードを見た時に古い情報を選別するためのまとめです。残念ながら、今時の書き方のみで構成された書籍などが存在しないからです。 たぶん明示的に書いていても読み飛ばす人はいると思いますが、すでに書いている人向けではありません。これから書くコードをこのスタイルにしていくのは別にいい
マネーゲームとしての仮想通貨は興味はないのだが、技術的に興味があって自分で簡単なコードを写経しながら勉強した。 定義 ブロックチェーンの実体はブロックを繋いだリスト構造 ブロックはいくつかの入力値(生成日時など)と、自分自身のハッシュを持っている 前のブロックのハッシュ値と、入力値を元に自分自身のハッシュが決まる。その手順は公開されている。 要はハッシュ値とそのメタデータが連続するただの配列なりの LinkedList。面白いのはここから。 ネットワークに参加するそれぞれが任意に新しいブロックを追加することができる ブロックチェーンは検証結果が正しく、より長いものが信頼される なのでビットコインみたいな仮想通貨は、生成コストが重く、検証コストが軽いものが好まれる。 他のネットワーク参加者からブロックチェーンの更新を受け取った時、手元のブロックチェーンとそれを比較し、より長いものを自分のブロ
こんにちは。みなさんもウェブアプリをリリースしたあとに同業者にソースごとパクられたことってありますよね。難読化しても難読化されたまま同業者のサーバで動くので困ったものです。そこで、私がとった解析しずらい対策をまとめてみたいと思います。 前提 多機能な画面をJavaScriptでゴリゴリ作ったのにもかかわらず、HTMLやCSS、JavaScriptファイル一式を自社サーバにまるごとコピーして、ライセンス表記だけ書き換えて使うような業者を罠にはめるということを想定しています。 当然通信をリバースエンジニアリングする人もいるので、自社サーバでは防げないという前提です。 HTMLにはauthorメタタグ よくあるMETAタグで権利者を明記します。これは権利の主張もそうですが、JavaScript自体に権利者が認定した権利者でなければ無限ループを起こすという処理のためにも使用します。逆に、権利者が我
はじめに Webフロントエンドの知識がjQueryで知識が止まっていたので、モダンなWebフロントエンドに触れてみた。そのメモ。 良かった点 「今はこうなっているのかー」と分かった。今後はナウい記事を読んでもビビらないと思う。 Reactのすごさ 触ってみて下の記事のいうことが理解できた。何がすごいの?と聞かれたら下の記事を掻い摘んで説明したい。 Reactを使うとなぜjQueryが要らなくなるのか 触ってみたもの ES6 Yarn Webpack Babel Sass/SCSS React とりあえずエディタ開いてHTMLを書くぞというタイプの人間だったので、フロントエンド開発にまずはコマンドラインを打って環境を構築する点が新鮮。自動化できるところはツールで共通化してラクできるところはラクをする、というのは分かった。Reactは使うか分からないが、Webpack/Babel/SCSSは絶
2017-11-09「フロントエンド開発に再入門する」タスクフォースの進め方こんにちは。開発本部の宍戸です。 メドレーでは定期的に、テーマに沿って組織の技術的な底上げを行うための機会(タスクフォースと呼んでいます)を行っています。そのタスクフォースの1つとして先日、フロントエンド開発力のベースアップを目的としたタスクフォースを行いました。本記事では、その取組みについてご紹介したいと思います。 背景メドレーには現在 20 人弱のエンジニアが在籍しており、その約半数がサーバーサイド出身者です。また普段の開発においては、一つの機能をフロントからサーバーサイドまで一貫して一人が担当するケースが多くあります。サーバーサイド出身者のフロントエンド開発のスキルセットには多少ばらつきはあるものの、普段の開発業務ではレビュー等でそれぞれサポートしつつ開発を行っています。 しかし、フロントエンドの基礎的な部分
ゲームジャム(Game Jam)にはさまざまな形があるが,その多くは24〜48時間という短時間でゲームをゼロから完成させることを目指す。だがその一方で,1か月という余裕のあるスケジュールでゲームの完成を目指すゲームジャムも存在する――ただしコードが合計で13KBを超えてはならないという,別の縛りがそこにある。はたして,この特殊なゲームジャムによって,参加者はどのような知見が得られるのだろうか? Game Industry Conferenceでの講演の模様をお届けしたい。 短時間(24〜48時間)でゲームを作る「ゲームジャム」というイベントは,全世界で一斉に開催するグローバルゲームジャムを筆頭に,さまざまな団体(あるいは企業内)で行われている。 そして,これまで多くの場合,「ゲームジャムがもたらすメリット」について語られてきたが,その一方で「ゲームジャムが持つ問題点」も,少しずつ開発者の間
どうも、まさとらん(@0310lan)です! 今回は、基本的なJavaScriptプログラミングが出来るようになった人向けに、さらなるステップアップを目指せる「YouTubeチャンネル」を厳選してまとめてみました! 海外のプログラミング系YouTube動画は、有料でもおかしくない「質」の高さと豊富なコンテンツ量に魅力があり、確実にレベルアップが期待できるのでぜひ参考にしてみてください。 ■JavaScriptの勘所を勉強できるYouTubeチャンネル! 【 Fun Fun Function 】 プログラミング動画とは思えない超ハイテンションなノリで、JavaScriptを学ぶうえで欠かせない勘所を分かりやすく教えてくれるのがコチラのチャンネル! 「Spotify」の開発にも携わっていたというプログラマーの彼は、得意のJavaScript言語を分かりやすく伝えることに情熱を注いでおり、それは
まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 https://www.nnn.ed.nico 一日8時間勉強時間があるなら、だいたい一ヶ月で終わる内容。 月額1000円だけどしっかり勉強すれば一ヶ月の無料期間中に終わると思う。 もともとN高等学校のノンプログラマーの生徒をWebエンジニアとして就職させるために作られたカリキュラムで講師曰く去年はこれで二人エンジニア就職を決めたらしい。 内容も相当親切に説明していて、プログラミングで何か作るだけじゃなくて、就職に必要な環境構築やセキュリティまでみっちりやる。 http://qiita.com/sifue/items/7e7c7867b64ce9742aee#%E3%82%B3%E3%83%B3%E3%82%BB%E3%83%97%E3%83%88%E3%82%92%E3%82%82%E3%81%A8%E3%81%AB
querySelectorを教えるべきかgetElementByIdとかでやるべきか一瞬迷う(結局querySelectorにする)
経緯 ドワンゴ様から恵贈頂いた。 高校生からはじめる プログラミング 作者: 吉村総一郎出版社/メーカー: KADOKAWA発売日: 2017/04/14メディア: 単行本この商品を含むブログを見る …読んでみたけど、HTML/CSS/JS の初歩的な部分を、初学者にやらせるとこうなる、という素朴な世界観で、CSSフレームワークもJSライブラリも出てこない。いや、出せと言ってるわけじゃない。理解せずにフレームワークを使う習慣がつくと、スクリプトキディ的な振る舞いによっていくし、教える側としても、変数が大きくなってコントロールできないのが問題だろう。 じゃあ基礎を抑えたとして、この先どう教えるといいんだろうな、というのは、たしかに自分も前から考えてはいて、それを書いてみる。 この文章のターゲット JavaScriptを教える人、またはポインタがあれば自学できる中級者以上 追記: すべての初学
JavaScript,jQueryの爆速コーディング、デバッグ方法論の勧め~実践向け逆引き(windows,chrome向け)~JavaScriptjQuery ※2017/4/21にオンロード時のデバッグ方法8を追記しました! こんにちは!エイチーム引越し侍の加藤です! みなさんJavaScript書いてますか? console.logめっちゃ使うよねーって人は目からうろこのデバッグ方法を、 ケース毎に紹介していこうと思います。(僕はconsole.log使いません) サーバーにデバッグ用のコードをアップロードすること無いので、 消さずに意図に反してリリースしてしまう危険性がないのもお勧めです。 前提知識 F12で出てくるデベロッパーツール(Elements, Console, Source, Network)の知識 Ctrl+Shift+Fで外部ソース(js,css)に対して一括検索が
「Front-End Developer Handbook 2017」がGitBookで無償公開。フロントエンドデベロッパーに求められるさまざまなスキル、要素技術、ツールなどを幅広く紹介する一冊 WebサイトやWebアプリケーションにおいて、ユーザーが操作する部分の開発を担う「フロントエンドデベロッパー」が扱う技術は急速に広がっています。 もちろんその基盤はHTML/CSS/JavaScriptにありますが、より高度で快適なユーザー体験を実現するにはその基盤となるHTTPやDNSといった下位レイヤの技術やSEOやUIデザイン、フォントといった細分化された専門性、そしてもちろんJavaScriptプログラミングやjQuery、React、Angularといったフレームワーク、JSONやAPIやパッケージマネージャ、ビルドツール、エディタやデバッガなどの周辺ツールとそのトレンドなど、とても一人
[JS]使い勝手がいい、文字を一つずつタイプライターのようにアニメーションで表示する軽量スクリプト -iTyped.js
個人的によく使う or 人に教える正規表現チェックツールをまとめました お役に立てますと幸いです 目次 Debuggex: Online visual regex tester Regexper Regular Expression Test Drive 正規表現チェックツール - Kaizen Platform RegexPlanet - Online Regular Expression (Regex) Testing and Cookbook Regex Tester Online regex tester and debugger Rubular: a Ruby regular expression editor and tester 1.Debuggex: Online visual regex tester 対応言語 JavaScript, Python, PCRE 正規表現を
どうも、まさとらん(@0310lan)です。 今回は、JavaScriptでJSONを使った「Webアプリ開発」に挑戦してみようと思います! そこで、アップルが提供している「RSS Generator」からJSONデータを取得し、多彩なジャンルのランキングサイトを構築してみましょう! 【 RSS Generator 】 「RSS Generator」という名前の通り、これはiTunes Storeで提供されているスマホアプリ、音楽、映画…などの最新情報をRSS形式で取得可能なURLを自動生成してくれるサービスです。 ただし、URLを少し変えるだけで「JSON(JSONP)データ」も取得できるようになっているので、このデータを読み込んでアプリや音楽などの最新ランキングを自動表示するサイトを作ってみたいと思います! ■必要なファイルを準備しよう! それでは、最初に必要となるファイルを準備すると
世界中の多くのWeb制作者・クリエイターが利用しているCodePenから、CSSやJavaScriptを使って実装された2016年にもっとも人気のあったデモを紹介します。 Top Pens of 2016 on CodePen Top Pens of 2016では、人気が高かったスゴ技が100個紹介されており、その中からベスト10を紹介します。 当ブログで紹介したものもいくつかあり、初見のものいくつかありました。 I DESIGN WITH CODE ❤ 10位は、Creogram animatedの動画にインスパイアされて実装されたSVGアニメーションのデモ。動きだけでなく、見せ方もうまいです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く