NoWhyLogs
1.0.0
別名Nowhylogs
？ /juditkaramazov
？ポートフォリオ
☕ブログ
私が恋に落ちたときのことを覚えています... Astro ？さて、ここに再び行きます！タイプスクリプトのタイプの安全性と開発者に優しい機能、 Reactの動的なインタラクティブ性と再利用可能なコンポーネント...およびアストロ。
たまたまその特徴的な柔軟性ときちんとした結果を始めたいと思うなら、アストロが試合に参加すると、そのような目標を達成することは容易ではないことを思い出させることができます。さて、そしてこれがあなたにとってそれらのニーズ・フォー・スピード™のもう一つの1つである場合に備えて、次の手順を考慮してください。
端末を開き、次のコマンドを実行します。
npm create astro@latest利用可能なスターターテンプレートもあります。
# create a new project with an official example
npm create astro@latest -- --template < example-name >
# create a new project based on a GitHub repository’s main branch
npm create astro@latest -- --template < github-username > / < github-repo >ついに：
npm run dev簡単ですよね？ Astroのドキュメントを自由に確認するか、Discordサーバーに飛び込みます。仲間の宇宙飛行士をお楽しみください！ ？
ヒント
あなたが何をしようと決心したとしても、プロジェクトとプラットフォーム自体と対話しながら、行動規範を尊重することを忘れないでください。あなたの時間と忍耐をありがとうございました！
数日前、私は最初のノーゲームを開始しました - 次のようにdevlogエントリ：
8月のこの日の最後の加熱された時間は、バルセロナから忍び寄るとき、このサイトの性質と建築を説明する奇妙で熱心な言葉で画面を冷却しています。激しく人間、本質的に自発的に。
正直なところ、自分の考えを言葉に明確にするのにかなり長い時間がかかりました - そして、私の不幸の有効な表現として他の何かとして役立つ可能性のあるサイトを最終的に作成するために必要な勇気と精神的強さを集めるのにさらに時間がかかりました「ウェブサイト開発者」よりも、私の仕事が「ソフトウェア」の概念の海岸に到達していることに気付いたときに使用をやめたラベルであり、関連する境界線はもうありませんでした。
レッドホットチリペッパーの象徴的なロードトリッピン 'を覚えていますか？ （ 「冗談ですか、ジュディ、それは傑作です。もちろん覚えています！」 、ええと、ええと。具体的な理由、そしてたくさんの高値と最低の後、私が静かに自問した瞬間、「私は誰であるはずですか？」、そして他の不幸なが人間のエピソードでは、最終的に何かになる可能性のあるスペースが必要だと自分に言いました太陽のためのその鏡に似ています。もしあれば、魂のための鏡。
おそらくご存知のように、私はすでに私の考え、分析、ナンセンスのいくつかを共有できるプライベートブログを所有しています。しかし、私はまだ座って、 video game developmentのエッセンスを消化するために時間をかけて、「日記」または「開発ブログ」の形で旅行自体を表すことができるbonき火に取り組んでいませんでした。だからこそ、Nowhylogs（ personal devlog containing relevant information on my progress as an indie developer ）が存在すると思います。霧が密集しすぎると、私たちは皆、自分の灯台を見つける必要があります。
灯台といえば！以前のスコアはただ素敵ではありませんか？
シンプルでアクセスしやすいものの、私はNo Why Games - Devlog （もう1つ！）、常にperformance 、 accessibility 、 best practices最初に配置します。
「どうやってそれをしたのか、ジュディは、誰も尋ねなかった。いくつかの秘密と特徴を共有させて、 「キー？」
間違いなく、 Accessibilityの概念と関係があるものは、毎日学ぶための可能性、疑問、新しいことの広大な海につながります。しかし、私はこのdevlogがas accessible as possibleであることを確認したかった（適切なランドマークのおかげだけでなく）。つまり、以下を使用してナビゲートできることを意味します。
KeyboardVoiceOver ？€ ヒント
例として、iOS 17以降を実行しているiPhoneでボイスオーバーをオンにすることができます。これは、設定 - >アクセシビリティ - > VoiceOverから実行できます。
「ソーシャルイメージ」とも呼ばれるOG画像（これは、Twitter、WhatsApp、DiscordなどのプラットフォームでWebサイトURLを共有するたびに表示される画像です）は、ソーシャルメディアエンゲージメントに不可欠な役割を果たしていますが、 Tは通常、それらを1つずつ準備する時間があります...正しいですか？右...？ （おそらく私はこの問題に直面しているのは私だけです... ）
デフォルトのOGイメージをフォールバックとして使用することは可能ですが（この場合、 public/nowhylogs-og.jpg ）、他に投稿後に投稿された同じ画像の静的な使用（そして過剰使用さえ）を避けたいと思いましたogimageは、frontmatterで指定されています。
Satoriのライブラリのおかげで、HTMLとCSSをSVGに変換できます（RTL言語はまだサポートされていないなどの制限があります...しかし時間を与えてください！）何も含めないでください。次に、表示されている美しい画像があります。
Post title 。Author name 。Site title 。ラチン以外の文字を使用する必要がある場合は、 src/utils/loadGoogleFont.tsに優先フォントを追加することを忘れないでください。
async function loadGoogleFonts (
text : string
) : Promise <
Array < { name : string ; data : ArrayBuffer ; weight : number ; style : string } >
> {
const fontsConfig = [
{
name : "IBM Plex Mono" ,
font : "IBM+Plex+Mono" ,
weight : 400 ,
style : "normal" ,
} ,
{
name : "IBM Plex Mono" ,
font : "IBM+Plex+Mono:wght@700" ,
weight : 700 ,
style : "bold" ,
} ,
]
// Rest of the code.検索ツールのないウェブサイトで特定の何かを見つけようとしたことを何度も覚えていますか？親愛なる見知らぬ人、あなたがそれについて言うように祈った神々は何を祈りましたか？黙り込む！それは通常、私には最近まで起こることなので、私は再びfuse.jsに力を与えたグローバルな検索を含めました。
詳細については、お気軽にご覧ください。
ヒント
私はすでにfuse.jsを使用していたことを考えると、あなたは私の心から愛されているKaramablogでそれを実装する方法を確認することもできます。私はあなたがそれを後悔しないことを約束します！
あなたはすでにあなたのサングラスを着ていますか？必要なし。最近必須であるように、私は読者の視覚体験を強化するためにtheme switcherを組み込みました。なぜ？ 「devlog」と書かれているにもかかわらず、それはまだブログであり、私たちの網膜は私たちにとって非常に重要なはずです！
この特定の機能とそのコンポーネントの詳細については、次をご覧ください。
「Seo-Thingysについて一度だけ議論するのをやめることができますか、Judit？」 、まったくではなく、まったくありません！それが議論の問題であれば、それは単にその存在がいくつかの点で私たちに利益をもたらすかもしれないからです。説明させてください：
「SEOフレンドリーコンテンツ」と呼ばれるのは、検索エンジンがそれを高くランク付けするのに役立つ方法で作成されたコンテンツのタイプです。いいえ、キーワードだけではありません。おもしろいことに、私たちが「SEO」と呼ぶものは、検索エンジンがカバーしようとしているトピックにコンテンツを見つけ、理解し、接続するのに役立つことを意図しています。
前に説明したdynamic ogImage覚えていますか？このような画像（開いたグラフのもの）でさえ、ソーシャルメディアの共有やSEOに役立ちます...それはその一部です！
たとえば、config.tsファイルをご覧ください。
export const SITE : Site = {
website : "https://nowhylogs.vercel.app/" ,
author : "Judit Lázaro" ,
desc : "A minimal devlog containing No Why Games' misadventures." ,
title : "No Why Games - Devlog" ,
ogImage : "nowhylogs-og.jpg" ,
lightAndDarkMode : true ,
postPerPage : 3 ,
scheduledPostMargin : 15 * 60 * 1000 ,
}これらの要素はすべて（標準的なURL、ソーシャルカードなどを含む）を、検索エンジンで簡単にクロールおよびインデックスを作成するために不可欠であり、検索エンジンの結果の可視性が向上します。
ご存知のように、RSSは、ユーザーとアプリケーションが標準化されたコンピューター可読形式でWebサイトへの更新にアクセスできるようにするWebフィードです。あなたと私のログがたまたま興味を持っていることをすぐに除草するように感じるなら、波状のボタンを押すことをheしないでください！ ？
import rss from "@astrojs/rss"
import { getCollection } from "astro:content"
import getSortedPosts from "@utils/getSortedPosts"
import { SITE } from "@config"
export async function GET ( ) {
const posts = await getCollection ( "blog" )
const sortedPosts = getSortedPosts ( posts )
return rss ( {
title : SITE . title ,
description : SITE . desc ,
site : SITE . website ,
items : sortedPosts . map ( ( { data , slug } ) => ( {
link : `posts/ ${ slug } /` ,
title : data . title ,
description : data . description ,
pubDate : new Date ( data . modDatetime ?? data . pubDatetime ) ,
} ) ) ,
} )
}簡単に、より良い！
美しいターミナルを使用して、プロジェクトのルートからすべてのコマンドを実行できます。
| 指示 | アクション |
|---|---|
npm install | 依存関係をインストールします。 |
npm run dev | localhost:4321でローカル開発サーバーを開始します。 |
npm run build | 生産サイトを./dist/に構築する |
npm run preview | ビルドをローカルでプレビューします。 |
npm run format:check | きれいにコード形式を確認してください。 |
npm run format | きれいなフォーマットコード。 |
npm run sync | すべてのAstroモジュールのタイプスクリプトタイプを生成します。詳細はこちらをご覧ください。 |
npm run lint | Eslintとの糸くず。 |
docker compose up -d | DockerでNowhylogsを実行します。 |
docker compose run app npm install | 上記のコマンドをDockerコンテナに実行します。 |
docker build -t nowhylogs . | NowhylogsのDocker画像を作成します。 |
docker run -p 4321:80 nowhylogs | DockerでNowhylogsを実行します。ウェブサイトはhttp://localhost:4321でアクセスできます。 |
ああ、はい...スタイル、スタイル...！
まず最初に、このサイトの存在を可能にした重要な要素のいくつかを共有できるようにしてください。
ただし、これは、この小さなプロジェクトの背後にある実際の仕事（人間）の最小限の部分です。
カラーパレット自体については、ゲームが理由ではないので、私の個人的なポートフォリオやブログで見ることができるように、私が慣れていたスタイルから（わずかに）距離を置く必要がありました。この距離は、私自身（現在のインディー開発者）への新しい近似と同様に、この辺りの非常に希少な芸術家なしでは不可能でした：@Aunedelec。
あなたの信じられないほど美しいロゴを破壊して非常に残念であると言うことから始めましょう。すべての冗談はさておき、ヴィーナでコーヒーを共有している間の会話、忍耐、サポート、鋭い目、極端なスキルがなければ、私は書くことに限定されない方法でビデオゲームを受け入れる勇気を集めたことはなかったでしょう、話し、それらについて考えています。
「あなたの才能、サポート、会社に感謝します」以外に追加したいものがある場合は、それは計り知れないことです。「私の人生の一部であることをありがとう」。どんなに暗くて空が時々見えるかもしれませんが、それらの雲はいつも太陽の前で青白くなります...そして、グルノーブルはバルコニーから賞賛するためにかなり美しい太陽を持っています！
Los Jugadores Son Mis Amigos 。そうは言っても、大声で誠実に触れずに、私の不穏な人生のこの新しい章を閉じることができませんでした： Thank you! ? 。
私たちの素晴らしいスポンサーである@Entreprises LEMRHALIに、あなたのサポート、落ち着き、知識、忍耐、そして全体の存在にthank you so much 。最近、「不確実性」は私たちの土地の周りに非常に大きな影を広げる作品です - そして、私がそうすることが可能であれば、私がその現実を変えたいと言うとき、私を信じてください（私は私の魔法の杖を忘れましたか時間？）しかし、私はすべてが遅れてその場所を見つけると信じています。
誰かがかつて言ったように：
アラバマ州からシカゴの恥ずかしがり屋まで走る州間高速道路 - 65人の高速道路。ケンタッキー州のこの地域では時間を辞めるべきですが、日光は揺れません。太陽は消えません。
翻訳： Hay Esperanza。
この作業は、MITライセンスの堅牢で暖かく、美しい屋根の下にあります。視覚的なコンテンツや書かれたコンテンツが何であれ、その背後にある著者とウェブサイトを指定する適切な参照が常に見つかります。
最近の帰属は不可欠であり、このプロジェクトに直接または間接的に参加した人は、可能な限り最高の認識に値します。そうは言っても、ここで見つけたものを楽しんだ場合にのみ、恐竜を非常に幸せにすることができることを忘れないでください...
