真のサーバーレスアーキテクチャについて語り、最新のエッジコンピューティングや生成系AIのサーバーレス実装を学び、クラウドネイティブで高速な開発プラクティスと向き合う2日間「ServerlessDays Tokyo 2023」。ここで登壇したのは、PingCAP株式会社の関口匡稔 氏。同社が開発する、オープンソースの分散型データベース「TiDB Serverless」について発表しました。全2回。後半は、TiDBを使ったアプリケーションのサンプル「OSS Insight」とChatGPTの機能「Chat2Query」について。前半はこちらから。 TiDBを使ったアプリケーションのサンプル「OSS Insight」 ここまで、TiDB Serverlessをどうやって作っていったかというコンセプトをご紹介してきました。ここから、TiDB Serverlessを実際に使ってみたという話をしたいと
こんにちは、eno1220です。 この記事では、私の所属する学校で行われた文化祭のIT化への取り組みについて紹介します。文化祭実行委員会等でIT系を担当する方などの参考になればと思います。 文章力がないため読みにくい箇所もあるかと思いますが、最後まで読んでいただけると嬉しいです。 記事の内容や記事中で紹介するソフトウェアに関して質問がある場合は、コメント欄や私のTwitterのDMへお願いします。 1.公式webサイト 1-1.制作までの流れ 昨年の文化祭 昨年実施された文化祭では新型コロナ感染症対策のため、クラス劇や有志発表を行う体育館への最大入場者数を全校生徒の半分に制限しました。体育館へ入ることのできない生徒に対しては映像を配信することになり、文化祭実行委員会(以下、実行委員会)から私(eno1220)の所属するパソコン部に担当の依頼がやってきました。 色々なことがあった結果、映像配
HTML・CSSの知識は不要。全222種類のパーツから お好みのものをご自身のサイトに取り入れることができます。 CSS Stockは「Web制作を楽にする」をテーマに、HTML・CSSのデザインやパーツをご紹介するサイトです。 お好きなパーツを選び、デザインや色を調整するだけ。あとはHTMLやCSSをコピペすれば、コーディング要らずでサイトに取り入れることができます。新しいスニペットも順次追加しており、色々なパーツを網羅できるよう日々尽力しています。 掲載しているコードについて 当サイトに掲載しているソースコードは全て自由にご自身のWebサイトやブログで使用いただいて構いません。もちろんオリジナルにカスタマイズしてご使用いただいても大丈夫です。 ただし別媒体でソースコード自体を掲載される場合は該当ページへのリンクを記載の上、参照元が当サイトであることを明記してください。 また掲載している
新年度も始まったということで、去年に引き続き注目トレンドのWebサイトをいっぱい見漁ってきました。 徐々に緩和されつつありますが、移動や外出が制限されていたこともあり、より刺激的な体験をインターネットに求める傾向がありました。また、社外だけではなく社内のコミュニケーションもオンラインが当たり前になっていることから、より効率的なコミュニケーションが模索されてきています。 AIを使ったサービスが爆発的に認知を広げていたりとさまざまな変化があるなかで、Webサイトはどう進化していくのでしょうか。妄想を膨らませながら見ていきましょう。 ※今回こちらの記事を参考にしています。 Top Web Design Trends of 2023 11 engaging web design trends for 2023 9 interactive web design trends for 2023 こんな
どうも、まさとらん(@0310lan)です! 今回はスプレッドシート風のデータベースを手軽に利用できる「Airtable」を活用したWebサイト構築サービスをご紹介します。 「Airtable」のデータを読み込むだけで、完全ノーコードによるWebサイトの開発が可能であり、そのままネット上へ公開できるホスティング機能も搭載されています。 基本的な機能は無料で利用できるので、手軽にWebサイトを作って公開してみたい人はぜひ参考にしてみてください! 【 Pory 】 「Pory」は「Airtable」と連携するサービスなので、あらかじめ以下のリンクから「Airtable」にログインしておきましょう。 <参考リンク> 「Airtable」公式サイト ■「Pory」の使い方 それでは、「Pory」をどのように使えばいいのか詳しく見ていきましょう! まずはサイトのトップページ上部にある【Sign up
本記事に紹介されているAPIはあくまで一例にすぎないので十分にご注意下さい。他にもAPIがある場合はコメント欄に書き記すようにお願いします。 今回の記事では、個人開発で役立つAPIを紹介する。 Google Play Developer API アプリ購入と公開の2つのタスクがある。 様々な公開タスクとアプリ管理タスクを実行できる Google YouTube Data API YouTubeを検索して動画・再生リスト・チャンネルなどの一覧を取得したり、更新したりすることができる。 検索条件で地域や言語を指定できるが、他の言語も混ざってしまうので「日本語の動画のみ取得する」というようなことはできない。 Google Maps JavaScript API Web上でGoogle Mapを表示してピンを立てたり経路を表示させたりするのに使える 独自のコンテンツと画像で地図をカスタマイズでき、
他にも、文字サイズの変更機能や見出しをつける機能、エンジニアの学習などのためにコードブロックを挿入し、コード中の文章を空欄化する機能なども備える。画像の挿入にも対応しているが、うまく動かない場合も多いという。 作成者の名人さんに開発経緯を聞くと、学生時代の自身の経験が基になっているという。「自分でテストを作ってそれを解く勉強方法を実践していて、テスト作成ツールをWindowsのソフトで作ったことがあった。年末年始にそのことを思い出して、今ならWebでも同様のツールを作れるのではないかと考えた」と名人さんは話す。 今後は有料コンテンツとして、さらなる機能の実装なども検討しており「社会人やエンジニア、学生などの個人学習などに活用してほしい」(名人さん)と話している。 関連記事 「脳がバグる」 200種類の“白”の中から目的の白色を探すゲームが話題 開発者は競技プログラマー 競技プログラマーの百
再利用可能なUI部品を組み合わせて画面を構築していくのは、多くのGUIアプリケーションにとって効率の良い開発手法です。ブラウザ向けにも多くのライブラリが再利用性を担保するための工夫を重ねてきましたが、実はブラウザ自身が再利用可能なUI部品を作成するための機能を備えていることはご存知でしょうか。本記事では、Web Componentsという名称で総称されるブラウザの機能について解説します。 対象読者 AngularやReactなどのフレームワークに頼らずに再利用可能なHTMLやCSSを整備したいマークアップエンジニア AngularやReactなどのフレームワークとWeb Componentsを併用する利点を学びたいJavaScriptエンジニア 前提環境 筆者の検証環境は以下の通りです。 macOS Monterey 12.3.1 Google Chrome 100.0.4896.127
どうも、まさとらん(@0310lan)です! 今回は、JavaScriptを使ってとにかく遊んだり楽しんだりできるインタラクティブなWebサービスやツールを厳選してご紹介します。 ゲーム体験をしたり、アート作品を作ったり、JavaScriptで開発されたユニークなサービスを利用してじっくりと遊んでみましょう。 Webの楽しい世界にご興味ある方は、ぜひ参考にしてください! ■リアルタイムにコードを書いて戦うオンライン対戦ゲーム 【yare.io】 世界中のプレイヤーと1対1で戦うゲームなのですが、その戦い方はJavaScriptのコードをリアルタイムに書き換えながら自機を操作するというのが大きな特徴です。 見た目は簡素なシューティングゲームですが、実はかなり奥深いストラテジーゲームみたいな要素が詰まっています。 ゲームの大まかな流れとしては、以下のとおりです。 JavaScriptで自機を制
どうも、まさとらん(@0310lan)です! 今回は、ごく普通のNotionドキュメントで構築された完全無料のWebサイトビルダーをご紹介します。 必要なものはNotionアカウントのみ! 多彩なコンポーネントをドラッグ&ドロップするだけで、誰でも簡単に美しいWebサイトを構築できるのが特徴で、フルカスタマイズ可能なノーコードサービスのように使うことができます。 Webサイトを手軽に構築したい方も含めて、ぜひ参考にしてみてください! 【 The Super Builder 】 Notionをまだ使ったことがない人は、以下の記事を参考にしながら新規アカウントを作成しておきましょう。 paiza.hatenablog.com ■「The Super Builder」の使い方 それでは、「The Super Builder」をどのように使えばいいのか詳しく見ていきましょう! 利用するにあたり、ユ
かなり幅広い分野で利用されている便利なツール・サイトや, 個人的に推していきたいものを紹介します。 今回の記事は,基本的にはゲーム開発者向けの内容となっております。 ただ,ゲーム開発者の方でなくても使えるモノが沢山含まれているので,一応最後まで目を通していただけるとありがたいです。 ※ 更新履歴 2021/12/17: 内容の大幅修正。項目にFigmaとMiroを追加。 2021/02/10: 項目にCanvaを追加。 GitHub プロジェクトの変更履歴を保存・追跡できるバージョン管理システム Git に幾つかの機能を加え,クラウド上で操作できるようにしたものです。 下記のようなケースに対応できます。 ファイルを消してしまったが,何を消したか分からない 開発途中で致命的なバグが発生したが,いつからあるのか分からない ひとつのプロジェクトを複数人で平行して作業を行いたい といったケースです
どうも、まさとらん(@0310lan)です! 今回は、JavaScript初心者から中級者までをカバーできる学習コンテンツを厳選してご紹介します。 完全無料で公開されているものばかりを集めており、なおかつ質の高いコンテンツを選んでいますので独学したい方にも最適です。テキスト、動画、本、Webアプリなど、さまざまな種類のコンテンツを楽しみながらぜひ学習に役立ててください! ■学習を始める前に これからJavaScriptの学習コンテンツについて解説をしていく前に、ひとつだけ以下のサイトをご紹介しておきます。 【 The Modern JavaScript Tutorial 】 これはJavaScriptの基礎構文・DOM操作・非同期処理・サーバ通信など、ほとんどの学習項目を網羅したリファレンスのようなサイトです。海外で作られたサイトですが、うれしいことに日本語化されているので初心者にも扱いや
どうも、まさとらん(@0310lan)です! 今回は、面倒な作業が一切不要の無料ホスティングサービスをご紹介します! とにかくソースコードなどのリソースをドラッグ&ドロップでアップロードするだけで、誰でも簡単に自分のWebサイトを公開できるのが大きな特徴です。作成できるWebサイトの数や容量もほとんど制限がないのに無料で使えるのも魅力的です。 Webサイトの公開に興味ある方はぜひ参考にしてみてください! 【 Static 】 ■「Static」の使い方 それでは、「Static」をどのように使えばいいのか詳しく見ていきましょう。 サイトにアクセスしたら【SIGN UP】の項目をクリックして、まずは無料のユーザー登録を済ませておきます。 Googleアカウントから手軽にログイン可能ですが、メールアドレスとパスワードの組み合わせでも簡単に登録できます。 登録が完了したら、以下のようなダッシュボ
iOS15からPrivate Relayという面白い機能が提供されます。 そこで、Private Relayを実際に使ってみた!を書いていきたいと思います。 Private Relayとは iOS15からiCloudで提供される機能にPrivate Relayがあります。Appleが提供するProxyを通してWebサイトにアクセスするもので、接続元IPがProxyによって隠蔽されることで、プライバシーに配慮した機能です。 詳しくはAppleの”Get ready for iCloud Private Relay“、”Apple’s privacy pillars in focus“を見た方が早いですが、動画から参照した内容はこのような構成です。(Apple’s privacy pillars in focus:29:20あたり) この例だと、AppleはPrivate Relay Netw
(English article is here.) こんにちは、吉岡(@yoshiokatsuneo)です。 MEANスタック(*)は、JavaScriptのみでフロントエンド、データベース、バックエンドの全てを開発できるWebサービス開発環境です。特にMEANスタックの一つAngularJS Full-Stack generatorでは、ウェブアプリケーション開発のノウハウが詰まっており、先人の知恵を生かすことで、見通しの良いソフトウェアを簡単・迅速に開発できるようになります。 ( * ) MEANスタックはMongoDB, Express, AngularJS, Node.jsを組み合わせています。 初回の記事ではMEANスタックの説明とインストールについて、2回目の記事ではTwitter風サービスの作り方について紹介しました。 今回は、具体的なウェブサービスとしてQAサービスを構築
どうも、まさとらん(@0310lan)です! 今回は、万能なドキュメントサービスとして人気の「Notion」を、さらにパワーアップさせて別の用途に活用できるWebサービスを厳選してご紹介します! すべて無料で利用できる(もしくは無料プランありの)サービスであり、機能的に優れていて誰でも扱える簡単な操作のものを厳選しました。 現状のNotionだけでは足りない機能を多く搭載できるサービスばかりなので、ご興味ある方はぜひ参考にしてみてください! ちなみに、Notionについてまだよく知らないという方は以下の記事で詳細を解説しているので合わせて確認しておくことをオススメします。 paiza.hatenablog.com ■Notionをメルマガ配信システムに変えるサービス! 【 NoCodeLetters 】 Notionで作成したテーブルをメルマガ(ニュースレター)のコンテンツ管理用データベー
どうも、まさとらん(@0310lan)です! 今回は、普段から使い慣れているGoogleスプレッドシートを高品質なWebサイトに変換できるWebサービスをご紹介します! ユーザーがやることはセルの値を変更するだけというお手軽さと、Webサイトのレイアウト構成を細かく変更したり上級者向けにJavaScriptやCSSを編集する機能も無料で提供されているのが特徴です。 手っ取り早くクオリティの高いWebサイトを作成したい人にも最適なので、ぜひ参考にしてみてください! 【 Siteoly 】 ■「Siteoly」の使い方 それでは、「Siteoly」をどのように使えばいいのか詳しく見ていきましょう! まずはサイトのトップページにアクセスして、画面上部にある【Login】ボタンから無料のユーザー登録をしておきます。 Googleのアイコン部分をクリックしてください。 するとアカウント選択画面が表示
どうも、まさとらん(@0310lan)です! 今回は、WebサイトのHTML内に1行のコードを追加するだけで、誰でもノーコードでカスタマイズができるようになるWebサービスをご紹介します! Webサイトの要素を直接クリックしてそのまま編集ができるようになるので、誰でも簡単にカスタマイズができるうえ、好きな要素を追加してまったく異なるページを作成してしまうことも可能です。 Webサイトのカスタマイズやノーコード開発にご興味ある方は、ぜひ参考にしてみてください! 【 Scepter 】 ■「Scepter」の使い方 それでは、「Scepter」をどのように使えばいいのか詳しく見ていきましょう! まず最初にトップページ上部にある【Sign up for Free】ボタンをクリックして無料のユーザー登録を済ませておきます。 ユーザー名・メールアドレス・パスワードを入力すれば登録完了です! 次に「S
どうも、まさとらん(@0310lan)です! 今回は、Webサイトの構造を可視化して直感的に理解しやすい「ビジュアルサイトマップ」を作成できるWebサービスをご紹介します。 ブラウザからGUIベースのエディタにアクセスするだけで誰でも利用可能で、すべてマウス操作でできるので初心者でも簡単に使いこなせます。ブロックを追加していくだけでサイトマップに簡易的なワイヤーフレームが挿入できる点がとても便利です。 また、既存のWebサイトから素早くサイトマップに変換する方法も合わせて解説しているので、ご興味のある方はぜひ参考にしてみてください! 【 Octopus.do 】 ■「Octopus.do」の使い方 それでは、「Octopus.do」をどのように使うのか詳しく見ていきましょう! トップページにアクセスしたら【Create sitemap】ボタンをクリックします。 すると「サイトマップエディタ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く