タグ

2024年6月5日のブックマーク (4件)

  • 神戸市内の区役所などに『電池類回収ボックス』を設置するみたい。捨て方が異なる「電池」の種類問わず利用OK | 神戸ジャーナル

    HOMEライフスタイル神戸市内の区役所などに『電池類回収ボックス』を設置するみたい。捨て方が異なる「電池」の種類問わず利用OK 乾電池・コイン電池は燃えないごみ、ボタン電池・充電式電池・モバイルバッテリーは家電量販店などにある回収ボックスと、捨て方が異なる『電池類』。神戸市が市内各区に新たに設置する「電池類回収ボックス」では、電池の種類に関係なく回収するそうで、電池の処分方法に新たな選択肢が加わります。 不要になった電池類を処分するときに特に困りがちなのが、リチウムイオン電池などの「小型充電式電池」やモバイルバッテリーは、クリーンステーションに出すことができないこと。 これはごみ収集車やごみ処理施設で強い力がかかることで、発熱・発火してしまう危険性があるためです。 こうした事故を防ぐためにも、家電量販店などに設置されている回収缶・ボックスでの回収となっています。 電池の種類排出方法設置場所

    神戸市内の区役所などに『電池類回収ボックス』を設置するみたい。捨て方が異なる「電池」の種類問わず利用OK | 神戸ジャーナル
  • CSSのメディアクエリを使ってレスポンシブに対応させる書き方|たかもそ/Web Creator.

    レスポンシブデザインには欠かせないメディアクエリですが、よく使う画面サイズの判定のほかにも、たくさんの機能があります。デバイスの機能やユーザーの設定によって、最適な表示を実装できたりします。意外と深いメディアクエリの書き方について紹介します。 <meta name="viewport" content="width=device-width, initial-scale=1">前提として、<head> 要素内にレスポンシブ用の <meta> タグを指定する必要があります。 基の構文メディアクエリの基的な構文は、メディアタイプとメディア特性からなります。 @media <メディアタイプ> and (<メディア特性>) { ... }メディアタイプはデバイスの種類、メディア特性は画面サイズやデバイスの機能、環境などの特性を指定します。 @media screen and (max-widt

    CSSのメディアクエリを使ってレスポンシブに対応させる書き方|たかもそ/Web Creator.
  • Nextjs App Router での静的サイトのための設定と実装 | suzu6

    NexjsのApp RouterでSSGでの静的サイトを構築した際の備忘録。 用意して頂いた環境が良くあるレンタルサーバーだったので、SSGで生成したindex.htmlをURLの通り分けたフォルダに置く必要があった。App Routerで作成して無理ならPagesに戻すつもりで進めたら、意外と何とかなった。 Nextjsのドキュメント | Static Exports ポイントは以下の通り。 next.configの設定 output: 'export' : 静的サイトまたはSPAとしてビルドする設定 trailingSlash: true : これを設定すると/path.htmlから/path/index.html となる。 pages.tsxの実装 'use client' : クライアント側で処理を実行する 動的にURLを生成するためのgenerateStaticParams()の

  • [Next.js] App Router環境下のページ毎のレンダリング形式の設定方法

    概要 今回は、最近実務の中で調査を行った App Router 環境下でのページ毎のレンダリング形式の設定方法について、まとめていこうと思います。 具体的には、Pages Router の環境と比べて、ページに対しての SSR と SSG の設定方法と、SSG での細かな挙動の設定方法などが異なっていたため、その辺りについての記載を行なっていこうと思います。 公式のドキュメントを参照しながらまとめたため、大きな解釈違いはないと思っているのですが、間違っている箇所などあれば気軽にご指摘いただけると嬉しいです。 今まで(Pages Router)のレンダリング形式の設定 getServerSideProps や getStaticProps で SSR や SSG の設定が行える getStaticProps は getStaticPaths で細かな定義が行えます getStaticPath

    [Next.js] App Router環境下のページ毎のレンダリング形式の設定方法