Next.js + Prisma + NextAuth.js + React Query で作るフルスタックアプリケーションの新時代
どうも、@yuyaaar です。 最近は Next.js アプリを見ることが多くなってきました。もはや JAM スタックの王道、と言っても過言ではないかもしれません。 ですが、やっぱりフルスタックとなると、データベースや認証などが必要になってきて、その辺のやり方がいまいちよくわからない、という人も多いのではないでしょうか。 自分もその一人でした。😅 いろいろ調べたり作ったりした結果、今現在もっとも最強コンビであろう、 Next.jsPrismaNextAuth.jsReact Queryでのフルスタックアプリケーションの作り方をこの記事では書いていきます。 今回は、チュートリアルアプリでよくある Todo アプリを作って、vercel にデプロイ、というのをやってみたいと思います。 まずは最初に Next.js ボイラープレートアプリを作りましょう。 作成できたら、まずは TypeScr
nginx で EU からのアクセスを拒否する - えいのうにっき
「あ、EUからのアクセスを拒否したいな......」と思うこと、ありますよね。私も今日、そう思いました。 私は趣味と実益を兼ねて（いるつもり）、いくつかのしょうもないWebサービスを個人で運用してるのですが、そこに対するEUからのアクセスを遮断したいと思い、それを nginx で対応してみたので、そのメモです。 手順 基本的にはこちら↓の知見の固まりを参考文献としています。 inaba-serverdesign.jp EU加盟国は、外務省のページ（EU加盟国と地図 第5次拡大｜外務省）によると以下の28カ国。 アイルランド イタリア 英国 エストニア オーストリア オランダ キプロス ギリシャ クロアチア スウェーデン スペイン スロバキア スロベニア チェコ デンマーク ドイツ（加盟時西ドイツ） ハンガリー フィンランド フランス ブルガリア ベルギー ポーランド ポルトガル マルタ ラ
見てるページを全部保存するという行ない - Diary
見てるページを全部保存するという行ない をもうずっとしていて、以下のような user.js でページを全部保存してます。 // ==UserScript== // @name 見たサイト全部保存 // @namespace http://tampermonkey.net/ // @version 0.1 // @author You // @match http://*/* // @match https://*/* // @grant GM_xmlhttpRequest // @noframes // ==/UserScript== if(!!document.querySelector('title')){ const title = document.querySelector("title").textContent; const url = location.href; GM_x
「中華ウェブカメラ」のセキュリティについて - 黒林檎のお部屋♬
黒林檎です。 今日は、IPカメラをハッキングしていこうと思います。 ◆最初に 巷で話題のIPカメラ『VSTARCAM Mini WIFI IP Camera 技術基準適合認定済み有線/無線LAN対応ネットワークカメラ C7823WIP』をハッキングして、どんなセキュリティリスクがあるか考えていきたいと思います。 hardshopper.hatenablog.com 最初に疑ったことはスピーカーの破損によるシステム音声のボヤきだったので、ウェブカメラで再生される音声データを抽出してみましたが、該当しそうな音声データはありませんでした。 中国カメラ音声 - Google ドライブ 金曜日にこんな面白い話が降ってきたので、速攻ポチって買いました。 同じシステムを使っているカメラを購入してハッキングしていたので、そこまで時間掛けずにハッキングできるだろうといったところでした。 (図)IPカメラ 私
Service Workerってなんなのよ (Service Workerのえほん) - Qiita
私 「ねぇ、Service Workerってあなた何者？」 Service Worker 「プログラム可能なネットワークプロキシです」 私 「.....(´Α｀lll)o0(ｲﾐﾌ)」 (この記事は元々英語で投稿した記事の翻訳版です。挿絵に入っているテキストが英語のままなのはご了承ください🙏) Service Workerってなんかカッコ良さそうだけど、実際問題なんなのかよくわからない ２０１５年７月、私はテキサス州オースティンで開催されたJavaScriptのカンファレンスに参加していた。ステージに立っていたのはJake Archibald、当時はなんかトイレの話ばっかりするおもしろイギリス人くらいにしか思ってなかったけれど、後々Service Workerのスペック策定に関わっているちょっとすごい人だと知る。 (なぜか)公衆トイレで発見したUXパターンについて話す傍ら、JakeはSe
猶予8時間！脆弱性だらけのサービスを堅牢化する実践型研修 - Speee DEVELOPER BLOG
Speeeエンジニアの西岡（@nisshieeorg）です。 去る7/5(水)、Speeeでは社内の全エンジニア向けに、セキュリティ研修を実施しました。本研修では、株式会社リクルートテクノロジーズの西村宗晃様に講師としてお越しいただきました。この場を借りてお礼申し上げます。 研修の目的 Webを主戦場にして戦う私達エンジニアは、自分たちのサービスそのものや、ユーザー、顧客を守るために、より安全なWebアプリケーションを構築する知識・技術を求められます。もちろんSpeeeでも、このような知識を身につけることは必須とした上で、日々の開発ではソースコードレビューや各種脆弱性診断ツールを用いて、私達が構築するアプリケーションの安全性を高めるよう努めています。しかし一方これまでSpeeeでは、「セキュリティに関する体系的な知識の学習法が会社から提示されていないため、個人の学習に依存している」「小さな
「知識を手に入れるための知識」がない人にとって、Google検索はあまりにも難しい。
私はGoogle検索が大好きです。 天文学も、サブカルチャー史も、世界史も、ググれば楽しい情報をざくざく掘り出せます。ただし、そのためには工夫が必要ですが。 Google検索は召喚術で、あなたの詠唱能力が試されている 偉大なグーグルウィザードは、Googleという名の巨大な魔法の杖に絶妙のワードを入力し、森羅万象を明らかにする。 ネットの奥底に眠る鉱脈を掘り当て、ときには女子中学生の精霊を眼前にかき集めてみせる。一方、駆け出しのグーグルユーザーは、ぎこちなくワードを唱え、wikipediaやyahoo知恵袋を呼び出すのが精いっぱい……。 この2013年のブログ記事を要約すると、「Google検索で良い知識を手に入れるには、検索ワードを工夫する必要がある」というものです。 “Google検索は、ありきたりの検索ワードしか入力しない人には、ありきたりの知識しか見せてくれない。だから、興味深い知
【pixiv論文】日本文学研究者が引用について語ってみる - 日比嘉高研究室
立命館のpixiv論文の件を遠巻きに見ていたのですが、日本文学研究の方にも飛び火してきた感じなので↓ togetter.com ちょっと考えたことを書いておきます。 目次はこんな感じになりました。長いですので、これからどうすべき（と私が考える）か単に知りたい人は、「さいごに」をどうぞ。 近代文学研究における引用の実態 古典文学研究における引用の実態 ネット掲載の「半公開」小説の引用 小説とプライバシー これからどう現代小説を引用していくのか さいごに : 忖度と萎縮と検閲と 近代文学研究における引用の実態 近代文学研究の世界では、引用に際して作者の許諾をとるということは、例外的な場合を除いて、一切ありません。著作権法の範囲内で、遠慮なくどんどんやります。 近代文学研究が扱う文学作品は、ほとんどが「公開モード」にあります。だれでも見られ、引用、言及でき、賞賛も批判もなんの遠慮もいりません。
［53選］国内注目のWebサービス・アプリを大調査！ プログラミング言語、フレームワーク、アーキテクチャの一覧【2017年】 - エンジニアHub｜Webエンジニアのキャリアを考える！
［53選］国内注目のWebサービス・アプリを大調査！ プログラミング言語、フレームワーク、アーキテクチャの一覧【2017年】 星の数ほど存在するWebサービスやアプリ。その裏側を覗いてみると、開発当時のトレンドや開発者の設計思想が見えてきます。53サービスのフレームワークやアーキテクチャ、開発効率化ツールを集めました。 国内だけでも星の数ほど存在するWebサービスやアプリ。その裏側を覗いてみると、開発当時のトレンドや開発者の設計思想が見えてきます。 今回は53サービス（追記を含む）のフレームワークやアーキテクチャ、開発効率化ツールを集めました。選定理由もお答えいただけたサービスについては、アーキテクチャを選んだ理由も紹介していきます。 C2C、コマース メルカリ、ココナラ、BASE、Tokyo Otaku Mode、STORES.jp、Snapmart、IQON 情報サービス グノシー、価
マージンやパディングでもう悩まない、モジュール式WebデザインにおけるHTMLとCSSの新しい実装方法
Webページを制作にする時に、マージンやパディングをどのようにつけるか悩むことがあります。2カラムの隙間は、左パネルの右マージンorパディングなのか、右パネルの左マージンorパディングなのか。 Web制作の今までの考え方がきっと変わる、モジュール式のアトミック デザインにおけるHTMLとCSSの実装のロジックを紹介します。 Learning from Lego: A Step Forward in Modular Web Design 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、著者様・元サイト様にライセンスを得て翻訳しています。 最近のWeb制作の手法は、数多くあるフレームワークやUIキットからあらゆる種類のコンテンツのブロックを組み立てています。しかしながら、モジュール性と汎用性はまだWeb要素レベルでは達成されていないと言えるでしょう。 LEGOブロックの考え方を
「すごいエンジニア」が目指すもの - megamouthの葬列
crapp.hatenablog.com を読んだ。id:Cedilleさんは、数少ない私の同好の士（一緒にされても困るだろうし、文章も怨念も私のレベルを遥かに凌駕していると思うが）だと感じている方で、 いつも楽しく読ませていただいている。 で、このエントリを読んだ感想としては、いい経験だと思うし、別にその中で生きていけばそのうち良い事あるよ、としか思わなかったんだけども、そもそも「すごいエンジニア」とはどういう存在なのか、ということを書いておきたくなったので、書く。 すごいエンジニアのイメージ だいたい前述のエントリに書いてある通りなのだが、この業界で「すごいエンジニア」として見なされる人のイメージを要約すると、こんな感じだと思う。 技術書を自分の給料で買いあさり、勤務時間外に読み漁ったりして、とにかくあらゆる事に詳しい。 アンテナを極バリして、githubでstarが100ぐらいしかつ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Javaは今でも無償ですという話と最近のJava Webフレームワーク / Java is still free and Java Web FW
2016年の女性向けスマホ漫画広告を振り返る（前篇） - 自意識ドットコム