Giter Club home page Giter Club logo

sveltekitblogapp's People

Contributors

kensukeota avatar

Watchers

avatar

sveltekitblogapp's Issues

ログイン・ログアウト機能の実装

  • ログインフォームを実装
  • hooks.server.tsを作成し、ログインユーザー取得のロジックを実装
  • ログイン処理を実装し、ログインユーザー名をトップページに表示
  • ログアウト処理を実装
  • ログイン時にユーザー登録フォームやログインフォームに遷移しようとしたらトップページにリダイレクトするよう実装
  • ユーザー登録処理後にログインも行われるよう実装

タグ機能の実装

  • svelte-tags-inputをインストールし、記事投稿フォームに追加し、タグ投稿処理を実装
  • 記事一覧ページと記事詳細ページに、その記事に紐づけられているタグを表示するよう実装
  • 該当のタグが付与されている記事一覧ページを実装
  • タグ更新処理を実装

コメント機能の実装

  • コメントのセクションの枠組みのUIを実装
  • 記事詳細ページのスタイルを調整
  • コメントを投稿するためのマークダウン機能付きのテキストエリアを実装
  • コメント投稿処理を実装
  • 未ログインユーザーの場合、テキストエリアを非表示にし、ログインフォームに遷移するボタンを配置
  • 投稿されたコメントを表示するためのロジックを実装
  • コメント更新機能を実装
  • コメント削除機能を実装

いいね機能の実装

  • いいねボタンを作成し、いいね処理を実装
  • いいねボタンの押下前と押下時のスタイルを実装

タイムライン機能の実装

  • タイムラインのページへ遷移するリンクを実装
  • フォローしているユーザーの投稿を表示するタイムラインページを作成し、表示処理を実装

ページネーション機能の実装

  • Paginationコンポーネントを作成し、ページネーション機能を実装
  • 現在のページが何ページか理解しやすくするために、現在のページ番号ボタンのスタイルを調整
  • 記事を削除したりして、記事の数に変化があったら、リアクティブにページ番号ボタンの数が再描画されるよう修正
  • 最後のページが1件だけのとき、その記事を削除したら、その前のページへ遷移するよう修正
  • 2ページ以降でブラウザをリロードしたら、?page=1の記事が表示されてしまう不具合を修正
  • 2ページ以降のページに遷移した後、1ページに遷移したらURLのクエリパラメータを引き継いでしまう不具合を修正し、1ページ目はクエリパラメータなしになるよう修正
  • トップページへ遷移したら、1ページ目の記事が表示されるよう修正
  • 全体的なスタイルを調整

記事更新機能の実装

  • 記事更新ページを作成し、リンクボタンを実装
  • 記事更新フォームを実装
  • 記事更新処理を実装
  • 未ログイン時や、ログインユーザーと該当の記事の著者が違う場合、トップページへリダイレクトするよう実装

いいねした記事の一覧表示機能の実装

  • いいねした記事の一覧ページを作成し、リンクを実装
  • いいねした記事の一覧表示機能を実装
  • 未ログイン時や、他のユーザーがいいねした記事の一覧ページに遷移しようとしたらトップページへリダイレクトするよう実装

ページネーション機能の実装

  • Paginationコンポーネントを作成し、ページネーション機能を実装し、ページのスタイルを調整
  • 記事を削除したりして、記事の数に変化があったら、リアクティブにページ番号ボタンの数が再描画されるよう修正
  • 最後のページが1件だけのとき、その記事を削除したら、その前のページへ遷移するよう修正
  • 2ページ以降でブラウザをリロードしても、そのページを維持するよう修正
  • 2ページ以降でブラウザをリロードした際の画面のちらつきを軽減させるロジックを実装
  • ブラウザの戻るボタン、進むボタンが使用された時、記事が更新されるよう修正
  • クエリパラメータが付与されているページから他のページへ遷移した後に戻るボタンを使用したら、適切なページが表示されるよう修正
  • トップページへ遷移したら、1ページ目の記事が表示されるよう修正
  • 全体的なスタイルを調整

マークダウン機能の実装

  • svelte-exmarkdownとgithub-markdown-cssをインストールし、Tailwind CSSがulタグやolタグに付与しているnormalize.cssを解除
  • 記事投稿フォームにマークダウン機能を実装
  • 記事詳細ページにマークダウン記法で書かれた記事をレンダリングするよう修正
  • 記事更新フォームにマークダウン機能を実装

記事投稿機能の実装

  • 記事投稿ページを作成し、リンクボタンを実装
  • 記事投稿フォームや記事更新フォームに必要な入力部品を実装
  • 記事投稿フォームを実装
  • 記事投稿処理を実装
  • 未ログイン時に記事投稿ページに遷移しようとしたら、ログインページへリダイレクトするよう実装

フォロー機能の実装

  • ログインユーザーを表す変数をauthUserに変更
  • マイページへのリンクを作成し、マイページを実装
  • フォロー処理とアンフォロー処理を実装
  • 記事一覧画面の個々の記事の作者名から、その人のマイページへ遷移できるようにリンクを実装
  • フォローしているユーザーを表示するページとフォロワーを表示するページを実装

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.