"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
【結論】 5ヶ月かけて無事完了しました。あー長かった。 新規の機能開発を止めないために一般的な開発チームでは今回のようなフロントエンドのフルリプレイスで一部新規の機能開発を止めながら開発を行うことがあると思います。 コードフリーズとなど呼ばれているものですね。 しかしログラスのようなスタートアップではプロダクトを絶えず進化させていくことがとても重要です。 機能開発を止めてしまえばたちまち大きな開発チームをもつ競合に追い抜かれて会社が負けてしまいます。 本記事ではフロントエンドフルリプレイスを新規機能開発を止めずに走らせる方法を解説していきます。 リプレイス概要本題に入る前に今回リプレイス対象となったLoglassについてとプロジェクトの概要について説明します。 【Loglassについて】 「プランニングクラウド Loglass」はBtoB SaaSのサービスの一つです。 基本はSSGやSS
おはようございます、なのくろです。年の瀬ですね。 この記事は ABEJA Advent Calendar 2020 の最終日です。 追記:おかげさまで Qiita LGTM賞 を受賞いたしました、ありがとうございます! 私は2020年01月にABEJAへ入社しました。チームではフロントエンド開発全般を任されています。 参入してちょうど1年が経過しましたので、今年取り組んだことをまとめました。 「フロントエンドを100倍速く」というタイトルは誇張気味なのですが、難しいことはせず、基本的なパフォーマンス改善を素直に実践したという話を書きます。 本稿では事例とやったことを紹介するのみですが、何かしらの知見や改善のきっかけに役立てば幸いです。 サービスについて 話をする前に、どんなサービスを開発しているかについて少しだけ触れます。 ABEJA社では「Insight for Retail」という、小
昨今の代表的なJavaScriptフレームワーク(React、Vue.jsなど)には「仮想DOM(Virtual DOM)」という概念が採用されているので、フロントエンド界隈の人は一度は耳にしたことがあるだろう。ただ、仮想DOMについて学ぼうと検索してもヒットするのは「フレームワークの使い方」ばかり。踏み込んでいても概念の説明どまりで、仮想DOMがどのように実装されているか解説した記事はすくない。 ということで、当記事では理解を深めるために仮想DOMを使ったフレームワークを自作し、仮想DOMに入門する! そして、ReactやVue.jsを単なるブラックボックスのフレームワークではなく、中身を理解して使えるようになることを、当記事の目標とする。 フレームワークが完成すると以下のようなWebアプリケーションがつくれるようになる。 TOC 記事が長くなりそうなのでも目次 そもそもDOMとは? D
builderscon tokyo 2018『Electronによるアプリケーション開発事情2018』
とても個人的な話ですが、ここ最近で自分自身のプライバシー意識の高まりを感じて、ブラウザの設定を見直す機会がありました。見直したのはCookieの設定で、許可したドメインにしかCookieを記憶しないようにしました。設定変更によるある程度の不便は覚悟していました。とはいえ、ま〜せいぜい、初回アクセスの時のモーダルが何度も出るようになるとか、ログインできなくなるとか、そのくらいかなと思っていました。 しかし実際は、悪い意味で期待を裏切られることになりました。 Cookieが無効なだけで、“全く”動かなくなってしまうウェブサイトやウェブアプリが、本当にたくさんあることに気づいたのです。 全く動かなくなってしまう原因は単純(後述)だったのですが、ちょっとした対処で簡単に直せることなのに、サイト全体が一切使い物にならなくなってて、もったいない!! と思いました。 フロントエンドの想定外 ウェブサイト
現場のES201x と未来のアーキテクチャ - インサイドフロントエンド2
新規立ち上げのチームを異動して、1年前に作った会社のフロントエンド環境(Vue.js + webpack(+Gulp))をベースに環境を作っていたのですが、 色々古かったので、新しくしました 今回作ったものはGitHubにあげてます https://github.com/kurosame/vuejs-boilerplate この中からやったことをいくつかピックアップして紹介したいと思います パッケージを最新にする npm install -g npm-check-updates npm-check-updates -u // package.jsonのパッケージを全て最新にして上書く npm update // package.jsonに記載してあるバージョンに更新する npm install 今回みたいにバージョンアップするパッケージが多い場合は、これでいいと思う 他のパッケージに依存し
ここでは、フロントエンド開発の概要について説明していきます。 *元記事はこちらです。(英語) この記事でカバーしているものについてSingle-page Apps (SPAs)New-age JavaScriptUser InterfaceState ManagementCoding with StyleTestingLinting JavaScriptLinting CSSTypesBuild SystemPackage ManagementContinuous IntegrationHostingDeploymentSingle-page Apps (SPAs)かつてはサーバーサイドレンダリングという、別のURLを開くごとにページをリフレッシュしてサーバーから新たなHTMLページを送る手法が主流でしたが、最近のSPAsではクライアントサイドレンダリングというものが主流になっています。
色々あってシンプルなtypescriptの開発環境をつくろうとして消耗した話です 小規模なプロジェクトをシュって書けるシンプルな環境がほしい でもナウくなっててほしい そもそもナウいとは... 最近のフロントエンドの人は何を言ってるのか全然わからないし依存パッケージが多すぎて混乱する でもちょっとはナウくなっててほしい 試行錯誤した結果 npm scripts + browserify + tsify + watchify で構成することにきめた. 本体を1行も書かないまま日付が変わっていた. もうナウくなくていいから本体が書きたい 構成 とりあえずbuildすると色々なものがdistに送られる構成にした ├── dist (static-assets) │ ├── bundle.js │ ├── bundle.css │ └── index.html ├── src │ ├── ts │
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く