タグ

ブックマーク / ics.media (5)

  • 最新版で学ぶwebpack 4入門 – JavaScript開発で人気のバンドルツール - ICS MEDIA

    webpack(ウェブパック)とはJSファイルをまとめる高機能なモジュールバンドラー。まとめることでウェブページのHTTPリクエストの数を減らしたり、高度なウェブアプリケーションの開発に役立ちます。 連載ではTypeScriptやBabelなどのES2015+の環境構築、ReactなどのJSライブラリの設定方法を網羅。サンプルファイルで詳しく解説します。 webpackの入門記事は他のサイトにもありますが、対象バージョンが古くて使えなかったりします。検索結果の上位の野良記事を参照にしたら古いバージョンの内容ばかり。解説記事通りにやったのにうまく動かない・・・なんて困った方も多いのではないでしょうか。記事は常に最新版に対応させているので、安心して読み進めてください。 ※記事では2023年3月現在のwebpack 5(2020年10月リリース)以上で解説しています。 記事で解説しているこ

    最新版で学ぶwebpack 4入門 – JavaScript開発で人気のバンドルツール - ICS MEDIA
  • Node.jsとSeleniumでWebアプリのUIテストを自動化(2023年版) - ICS MEDIA

    Webアプリケーションを開発する際、みなさんはどのようにテストを行っていますか? Webアプリケーションは、ユーザーごとに異なるブラウザを使用しており、ユーザー操作も必要となるため、手作業でテストをされている方も多いと思います。また、機能改修やバグフィクス後に、リグレッションテスト(改修により既存機能への影響がないかを確認する回帰テスト)が必要となりますが、時間が取れずしっかりとテストができていない方も多いのではないでしょうか。 記事では、これらのテストを自動化することのできる「Selenium Webdriver」(セレニウム ウェブドライバー)について紹介します。 入力フォームのバリデーション機能をチェックするデモ 簡単な入力フォームのバリデーション機能をチェックするデモを動画で紹介しましょう。入力値に対して期待するエラー文言が表示されているかのテストを実施しています。Seleniu

    Node.jsとSeleniumでWebアプリのUIテストを自動化(2023年版) - ICS MEDIA
  • Webサイトからプッシュ通知を送ろう! JavaScriptでのプッシュ通知の実装方法 - ICS MEDIA

    スマートフォンアプリではおなじみのプッシュ通知ですが、ウェブサイトからもプッシュ通知できることをご存知でしょうか? JavaScriptのServiceWorkerとPush APIを使用することで、ウェブサイトからでもスマートフォンアプリと同様にユーザーにプッシュ通知を送ることができます。また、モバイルだけでなくデスクトップでも通知を行うことができるため、ユーザーエンゲージメントの向上の手法として有効です。 プッシュ通知のデモ プッシュ通知を行う簡単なサンプルを用意しました。Chrome 42以降のブラウザで確認してください(2018年3月現在のChrome 65で動作することを確認しています)。 「プッシュ通知の配信設定」のトグルを選択すると、「cURLコマンド」のボックスにコマンドが生成されます。このコマンドをMacをお使いの方はTerminal上から実行してください。Windows

    Webサイトからプッシュ通知を送ろう! JavaScriptでのプッシュ通知の実装方法 - ICS MEDIA
  • JenkinsとSeleniumを使ってWebコンテンツの自動UIテスト環境を作ろう! - ICS MEDIA

    先日公開した「UIテストの自動化!Node.jsとSeleniumでWebアプリのUIテスト環境構築」では、手動で行っていたWebアプリのUIテストをSeleniumを使って自動化する手法についてご説明しました。 SeleniumでUIテストを自動化することにより、リグレッションテスト(改修により既存機能への影響がないかを確認する回帰テスト)が簡単にでき、バグの早期発見に繋げることができますが、実際にはこのテストを運用でしっかりと行っていかないとプロジェクトとしての品質向上にはつながりません。また、コマンドラインの扱いに慣れていない方は、コマンドラインからのテストの実行に抵抗があり、テスト結果もコンソールに出力されるため見づらいと思う方も多いと思います。 そこで今回はCI(継続的インテグレーション)ツールであるJenkinsとSeleniumを連携することで、定期的にテストを実行し、テスト

    JenkinsとSeleniumを使ってWebコンテンツの自動UIテスト環境を作ろう! - ICS MEDIA
  • SourceTreeの使い方 | コミットの再編集・変更方法 - ICS MEDIA

    Gitでの開発で、こんな体験はありませんか? 3つ前のコミットのメッセージにミスがあった。修正したい・・・ このコミットの順番入れ替えたいなぁ このコミット、ホントは要らなかったから削除したいなぁ …… 実はそれGitでできるんです!今回はGitクライアントソフトのSource Treeソース・ツリーでコミットログを修正する便利な機能「rebase interactiveリベース・インタラクティブ」を解説します。 コミットの再編集ができる機能とは? Gitではコミットを再編集する機能を「git rebase interactive」といいます。たとえば、コミットの入れ替えや編集、統合、削除ができます。正確に説明すると、コミットそのものを編集するのではなく、新しくコミットのコピーを作成して1つずつコミットを組み立てる機能になります。 Source Treeでコミットログを編集しよう Sour

    SourceTreeの使い方 | コミットの再編集・変更方法 - ICS MEDIA
    cpp_0302
    cpp_0302 2015/03/31
    コミットログの修正、コミットそのものの修正などをSourceTreeでやる。
  • 1