ノート共有型SNS『eeNotes』の投稿フォームにreact-quillを採用した理由や、カスタマイズのポイントを詳しく解説！

ノート共有型SNSの投稿フォーム実装【前編】react-quill選定の理由とカスタマイズポイント

react-quillとEditor.jsを中心に、テキストエディタライブラリの特徴・利点・懸念点を比較。選定のポイントを詳しく解説！

テキストエディタライブラリ比較【前編】react-quill & Editor.jsの特徴と選定ポイント

PELL・trixの特徴や利点、懸念点を比較しながら、テキストエディタ選定のポイントを解説。QuillやEditor.jsとの違いも紹介！

テキストエディタライブラリ比較【後編】PELL & trixの特徴と選定ポイント

小幡 十矛（Tomu Obata）｜「共創型フリーランスエンジニア」として、iOSアプリ開発・新規事業立ち上げ・ブランド構築を支援しています。エンジニアリングとコミュニティづくりを軸に、人とつながる価値を生み出す。

小幡 十矛（Obata Tomu）｜共創型フリーランスエンジニア・iOSアプリ開発・新規事業支援

ノート共有型SNS『eeNotes』の投稿フォームにQuillを導入！テーマの違いやカスタマイズの工夫、タグの変更方法などを詳しく解説。

ノート共有型SNSの投稿フォーム実装【後編】Quillのテーマ設定とカスタマイズテクニック

Author

Content

Published Date

Featured Image

Comments

Is Featured

Email

Phone Number

Article Writing Date

Genre

Page Name

サイズ(昇順)

ライブラリー

Default view

<a href="https://lin.ee/wdR6Udp" 
   target="_blank" 
   class="cta-fixed" 
   id="cta">
   💬 LINEでTomuと話してみる
</a>

<script>
  window.addEventListener("DOMContentLoaded", function () {
    const path = window.location.pathname;
    const cta = document.getElementById("cta");

    if (!path.includes("/portfolio") && cta) {
      cta.classList.add("cta-enabled");
    }
  });
</script>


エンジニアリングとビジネスの両輪で、“ちょっと未来の当たり前”を共創。リアルとデジタルの交差点から、新規事業やブランドづくりの挑戦をかたちにしています。
本サイトでは、小幡十矛のプロフィール・実績・活動領域をご紹介しています。

小幡 十矛｜共創で価値をつくるエンジニア・新規事業×ブランドづくり

リアルとデジタルの交差点から、iOS開発・新規事業・ブランドづくりの挑戦を発信。キャリアづくりや共創のプロセスも綴っているブログ一覧ページになります。

小幡 十矛(おばた とむ)の共創ブログ｜iOS×新規事業×リアルとデジタルの交差点から生まれる挑戦の記録

2019年3月16(土),3月17日(日)に行われた、サイバーエージェント主催『AbemaTV Hack - ネイティブアプリ編』にiOSエンジニアとして参加！お題の発表から開発プロセス、UI/UXの工夫、LTで学んだアーキテクチャ設計の考え方まで詳しくレポートします。

AbemaTV HackにiOSエンジニアとして参加！開発プロセスとUI/UX設計の工夫【その1】

サイバーエージェント主催『AbemaTV Hack - ネイティブアプリ編』に参加し、投げ銭UXを改善！Lottieを活用したアニメーション演出やUI設計、Rxを活用した開発の課題と今後の学びについて振り返ります。 

AbemaTV Hackで投げ銭UXを改善！Lottieでのアニメーション演出と開発の振り返り

KotlinのActivityで定義したメソッドをAdapterから呼び出すには？Interfaceを活用した最適な実装方法を、コード例と共に解説！

ActivityのメソッドをAdapterから呼び出す方法｜Interfaceを活用したKotlin実装ガイド

AppDelegate.swiftから特定のタイミングで画面遷移させる方法を解説。ローカル通知受信時などに使える2つの実装パターンを比較し、それぞれのメリット・デメリットを紹介します。

AppDelegate.swiftから画面遷移する方法【2つの実装パターンを解説】

Swiftを例にPlantUMLでクラス図を作成する方法を解説。初期設計の可視化や既存コードのクラス図自動生成の手順も紹介！

PlantUMLでクラス図を作成！Swiftで学ぶ初期設計の可視化

Notionのページを美しく整理するための3つのポイントを解説！目次の作成、見出しの背景色設定、Calloutブロックの活用で、より読みやすく綺麗なページを作成しよう。

Notionで見やすいページを作る3つの工夫｜目次・背景色・Callout活用法

サイバーエージェント21卒内定者が活用したNotionの同期図鑑、勉強会、ハッカソン、ラジオ、自己紹介LTなど、技術とコミュニケーションの工夫を振り返る。オンラインでも同期理解を深める取り組みを紹介！

サイバーエージェント21卒内定者の挑戦と成長｜同期コミュニケーションを支えた技術と活動

Notionのデータベース作成時、InlineとFull pageの違いとは？Inlineの利点やカスタマイズ性、埋め込み活用方法を詳しく解説！

NotionのデータベースはInlineで作成すべき理由｜Full pageとの違いを解説

初めて出前館を利用し、『デビューキャンペーン』と『週末半額祭』を併用できるか検証！お得にピザを注文できた方法や実際の注文画面、注意点をまとめました。

出前館デビュー！キャンペーン併用でお得に注文した話

2019年のドラクエ福袋を開封！ぬいぐるみやフィギュア、レアアイテムがたくさん！画像付きで詳しく紹介します。

2019年のドラクエ福袋を開封！中身を写真付きで大公開

チーム開発を成功させるためのファシリテーション、タスク管理、コミュニケーション戦略を徹底解説！より良いプロダクトを効率よく作るためのノウハウを紹介。

チーム開発を効率よく進めるために｜HRTの精神と実践的なタスク管理

NotionのFull pageデータベースをInline形式に変換する手順を解説！EvernoteからNotionに移行した理由や運用の工夫についても紹介。

NotionのFull pageデータベースをInlineに変換する方法｜Evernoteからの移行体験も紹介

Swiftでimport AppKitをした際にNo such module 'AppKit'エラーが発生する原因と解決方法を詳しく解説。Xcodeの設定変更でエラーを解消する方法を画像付きで紹介します。

import AppKitでNo such module 'AppKit'とエラーが出る時の対処法

Indifyを活用してNotionに時計・カウントダウン・天気予報・カレンダーなどを埋め込む方法を徹底解説！あなたのNotionページをより便利にカスタマイズしよう。Notion Advent Calendar 19日目の記事になります。

IndifyでNotionをカスタマイズ！便利な埋め込みウィジェットを全解説

Notionのブロックを横並びに配置する方法を解説！Inlineデータベースを横並びにする2つの方法や、使い分けのポイントも紹介。

Notionでブロックを横並びに配置する方法｜Inlineデータベースの活用法も解説

iOS14で進化したWidget機能を活用し、ホーム画面をカスタマイズ！NotionのWidgetを使って、ページをワンタップで開く方法やおすすめの活用術を紹介。Notion Advent Calendar 14日目の記事になります。

iOS14のWidget機能を活用！ホーム画面のカスタマイズとNotionの便利な使い方

SwiftとXcodeの基礎を2日で学ぶ！『たった2日でマスターできるiPhoneアプリ開発集中講座』を読んで学んだこと、オートレイアウトやXcodeの便利な使い方、そして実際に2日で読み切れたのかをレビューします。

2日でiOS開発をマスター？『たった2日でマスターできるiPhoneアプリ開発集中講座』を読んでみた

JetBrains IDEのショートカットを厳選して紹介！Mac環境で使える便利なキー操作をGIF付きで解説し、コーディングの効率を劇的に向上させます。

《生産性向上》JetBrains IDEの厳選ショートカット集【前編】

《生産性向上》JetBrains IDEの厳選ショートカット集【後編】

Next.js 9→11、Node.js 12→16へアップデート！yarn upgradeの実行方法、Vercelでの設定変更、webpack5対応、エラー修正の手順を詳しく解説。

【Notion Blog】Next.jsとNode.jsのバージョンを最新にアップデート | Notion

Notion Advent Calendar 2020 最終日！Notionの活用術・公式API・日本語対応の展望など、これからのNotionの可能性を深掘りします。

Notionの未来と可能性｜公式API・日本語対応・運用ノウハウ

Notionのページにコメント機能やリンクコピー機能を追加する方法を解説！ApptionのComments for NotionとLink Copyを活用して、フィードバック収集やURL共有を簡単に行うコツを紹介します。Notion Advent Calendar 16日目の記事になります。

Notionにコメント＆リンクコピー機能を埋め込む方法｜Comments for Notion & Link Copyの活用

Notionのデスクトップアプリとブラウザ版、それぞれのメリットと適した使い方を解説！複数アカウントの管理やウィンドウ操作のコツ、便利なショートカットも紹介。

Notionデスクトップ vs. ブラウザ版の違いと使い分けガイド

Notionのページ埋め込み機能を完全ガイド！対応コンテンツ一覧やWeb bookmark・embedの違い、TypeformやGoogle Driveなどの活用事例を詳しく解説します。

Notionのページ埋め込みを徹底解説！対応コンテンツ・活用事例・便利な使い分け

Notionのページに天気予報を埋め込む方法を解説！WeatherWidgetを活用し、カスタマイズ可能な天気ウィジェットを簡単に追加する手順を紹介します。Notion Advent Calendar 15日目の記事になります。

Notionに天気予報を埋め込む方法｜WeatherWidgetでおしゃれにカスタマイズ

Notionの『お気に入り』機能を活用して、頻繁にアクセスするページを効率的に管理する方法を解説。おすすめの運用ルールや活用例も紹介！Notion Advent Calendar 21日目の記事になります。

Notionお気に入り機能の使い方！アクセス効率を上げる活用術

Notionの無料プランでは編集履歴を遡れませんが、削除したページを復元する方法はあります。本記事では、誤って消してしまったページを簡単に復元する手順を解説！

Notion無料プランで誤って削除したページを復元する方法

NotionのFull width設定を活用すると、表示エリアを最大限に広げて快適に閲覧・編集可能！デフォルト設定やテンプレート活用の方法も詳しく解説。

NotionのFull width設定を活用！ページを広く使うメリットと設定方法

NotionのWebクリップ機能を活用し、Inboxに一元管理する運用法を解説。情報整理を効率化し、必要な情報を見逃さない管理術とは？ Notion Advent Calendar 23日目の記事になります。

NotionのWebクリップ活用術！Inboxで情報を整理する最適な運用法

Notionの特徴や基本機能を詳しく解説！個人でのメモ管理からチームでのコラボレーションまで、活用法を分かりやすく紹介します。

Notionの特徴と基本機能を徹底解説！個人・チームでの活用法

Notionのページコピー時に気をつけるべきポイントと、Copy linkを活用したリンクの管理方法を詳しく解説。ページ間の同期をスムーズにするテクニックを紹介します！

Notionのページコピー時の注意点と便利なリンクの使い方

Notionで読書ログを管理する方法を解説。本の記録・整理・活用のコツを紹介！データベース活用で読書習慣を効率化し、知識を最大化する方法とは？

Notionで読書ログを管理！本を整理し知識を最大化する方法

NotionのRecent page機能を使えば、直近で開いたページに素早くアクセス可能！PC・スマホでの使い方、ショートカットキー、前の画面に戻る方法を詳しく解説します。

NotionのRecent pageを活用！直近のページを素早く行き来する方法

Notionの検索機能を最大限に活用するためのショートカットを解説！Quick Findやページ内検索、フィルター検索の使い方を詳しく紹介します。

Notionの検索ショートカットを活用！Quick Findやフィルター検索の使い方

Notionのページにカウントダウンを埋め込む方法を解説！Simple CountDownを活用し、締め切りやイベントを見える化することで生産性を向上させるコツを紹介します。Notion Advent Calendar 17日目の記事になります。

Notionにカウントダウンを埋め込む方法！Simple CountDownの使い方を解説

Notionを活用した情報整理術！ページ構成の設計方法や日々の運用ルールを解説。シンプルで効率的なNotion管理を実現する方法とは？ Notion Advent Calendar 22日目の記事になります。

Notionの構造設計完全ガイド！効率的な情報整理と運用のコツ

Notionのテンプレート機能を使えば、よく使うページを一瞬で作成可能！作業ログや議事録の効率化に役立つテンプレートの設定方法を詳しく解説！Notion Advent Calendar 20日目の記事になります。

Notionのテンプレート機能を活用！効率的なページ作成＆運用のコツ

アウトプットを習慣化し、成長を加速させる方法を解説。考えを整理し、知識を蓄積し続けるためのルーティンやNotionを活用した効率的なアウトプット術を紹介します！

アウトプットを継続するための流儀とルーティン | 成長を加速させる方法

NotionのPDFプレビューでフォントが崩れる問題や正しく表示する方法を解説。Original Viewやダウンロード方法を活用し、閲覧時のトラブルを回避しましょう。Notion Advent Calendar 13日目の記事になります。

NotionのPDFプレビュー時の注意点と正しく表示する方法

RailsTutorialを進める中で躓いたポイントや解決策、Herokuデプロイの問題、Git関連のトラブル、テストエラーの対処法などをまとめました。初心者の方に役立つRails学習のヒントを紹介します。

RailsTutorialを進めていく中で躓いたことや、ポイントだと感じたこと

Reactを使ってChrome拡張『Active Tab Lister』を開発＆公開した経験をシェア！開発背景・manifest.jsonの設定・デバッグ方法・Chromeウェブストアへの公開手順を詳しく解説。

ReactでChrome拡張を開発＆公開！開発背景・デバッグ・公開手順を解説

Redisとは何か？その特徴やリレーショナルデータベースとの違い、memcachedとの比較、データ削除の仕組み、主要なデータ構造について初心者向けに簡単に解説します。

Redisの特徴について容易にまとめてみた

Scalaの基本を網羅！if式・match式・クラス・トレイト・関数などをサンプルコード付きで解説。初心者にもわかりやすい構成で逆引きにも最適！

Scalaの基本を学ぶ【その1】〜制御構文・クラス・オブジェクト・関数〜

ScalaのコレクションAPIを徹底解説！List・Map・Setの使い方から、foldLeft・map・filterなどの便利メソッドまで、サンプルコード付きで詳しく解説します。

Scalaの基本を学ぶ【その2】〜コレクション・リスト・マップ・セットの使い方〜

Scalaのケースクラス・パターンマッチング・エラー処理（Option, Either, Try）・Implicit（暗黙の型変換・パラメータ）の使い方を徹底解説！サンプルコード付きで詳しく解説します。

Scalaの基本を学ぶ【その3】〜ケースクラス・パターンマッチ・エラー処理・Implicitの活用〜

fishシェルを活用した便利なコマンドやターミナルのカスタマイズ方法を紹介！bass、bat、exaなどの効率的なコマンドや、快適なシェル環境を構築する設定を解説。

便利なシェルコマンド＆カスタム設定｜fishシェルで快適なターミナル環境を構築

VOYAGE GROUPの3週間インターン『Treasure』の講義パートを振り返り。Go言語・API開発・CTOのLTなど貴重な学びをシェア！

VOYAGE GROUPのインターン『Treasure』参加レポート【講義パート1】

VOYAGE GROUPの3週間インターン『Treasure』の講義パートを振り返り。フロントエンド技術・React/Vue・Promise・非同期処理の学びをシェア！

VOYAGE GROUPのインターン『Treasure』参加レポート【講義パート2】

VOYAGE GROUPの3週間インターン『Treasure』の講義パートを振り返り。データベース設計・セキュリティ・認証・インフラなどの学びをシェア！

VOYAGE GROUPのインターン『Treasure』参加レポート【講義パート3】

VOYAGE GROUPのエンジニアインターン『Treasure』に参加！チーム開発の進め方・KPTによる改善・プロダクト開発のポイントを詳しく解説。学びや成長の記録をシェア！

VOYAGE GROUPのインターン『Treasure』に参加！【チーム開発編】

Xcodeで実機デバッグ中に発生する"Thread 1: signal SIGABRT"エラー。0_abort_with_payloadの原因と、dyld: Library not loadedに関連するライブラリの問題を解決する方法を解説します。

Xcodeで実機デバッグ中に"Thread 1: signal SIGABRT"が発生！原因と解決方法

GoogleカレンダーをNotionに埋め込む2つの方法を比較！標準の埋め込み機能とIndifyのウィジェット、それぞれの特徴やメリット・デメリットを詳しく解説します。Notion Advent Calendar 18日目の記事になります。

【比較】GoogleカレンダーをNotionに埋め込む方法！Indifyと標準機能の違いを解説

XserverのドメインをNotionに接続する方法を解説。DNSレコード設定、ネームサーバー変更、CNAME・TXTレコード登録、検証手順まで詳しく説明します。

XServerで取得したドメインをNotionサイトに設定する

フリーランスiOSエンジニア・小幡 十矛（Obata Tomu）の職務経歴・開発実績ポートフォリオ。ABEMA LiveやAmebaのiOSアプリ開発、新規事業・ブランドづくりの共創事例を紹介。

小幡 十矛(Obata Tomu)｜iOSエンジニアの開発実績・職務経歴ポートフォリオ｜共創×アプリ開発×挑戦

📎 by 小幡 十矛（@obata_tomu）｜挑戦と共創の現場から

コーポレートサイト向けのテーマCSSです。※セクション分割機能を使うと、トップページでは最初の見出しまでのエリアがカバー画像の上に重なりますので、テンプレート通りのレイアウトのままご利用ください。

Theme CSS for corporate sites. *When using the section divider function, the area up to the first heading will overlap the cover image on the top page, so please use the layout as per the template.

テキストエディタライブラリ比較【後編】PELL & trixの特徴と選定ポイント

比較したテキストエディタライブラリ

PELL

データ構造

利点

サイズ比較

懸念点

trix

データ構造

利点

懸念点

おわりに