最後の日の夜明け- 24時間残って-


地獄からの学期はほとんど終わっています.私が最終的に丸い月のために自由になるまで、わずか24時間は残ります(よく、多かれ少なかれ).しかし、まだ私は別の割り当てを行うには、サンタ慈悲があります.
これは私のオープンソース開発クラスのための私の3番目と最終的なブログ記事のリリース0.4です.それは爆発でした、しかし、党は終わっています、そして、誰でも帰りたいです.
それで、私は元々新しいNextJSフロントエンドのためにグローバルなスタイルシート構成を実行するために、私の旅行に出発しました.我々はすでに物事のギャツビー側のために1つを持っていたが、我々はNextJSに切り替えているので、すべてのスタイリングも同様に移植される必要がありました.私は、このPRのために何をする必要があるかについてブラッシュアップするために、typescriptとnextjsチュートリアル(2つの何も知らない)をしている数時間を費やしました PageBase.js ファイル(それを担当するファイル)は、(SEO)よりはるかに多く、完全にグローバルな設定を実装するために、より多くの仕事を必要とします.Gatsbyが最初につくられなければならなかったMaterialui(私も研究した何か)を使いますので.次にSEO.グローバル設定.次にスタイリング.oof私は、私がこれのために噛むことができたより多くを噛んだかもしれません.私は、平均的な時間で何か他のものに取り組むことに決めて、私がそうすることができるならば、これに戻ります.
私の次の課題はabout nextjsポートのページ.簡単に十分です.
いつものように、私は少しの偵察で解決のために狩りを始めました.私は、ギャツビーがどのようにレンダリングされるかを学びたかったですabout ページ.奇妙なことに、それは直接ルートにMDページにリダイレクトし、それをレンダリングします.それはきちんとしていませんか.プロジェクト内の他のすべてのページコンポーネントがどのように作成されているかには少し矛盾しますが、それでもなおクールです.これを使うGraphQL and something called slugs , つについても私はビットを学ぶ必要がありました.sooo、どのように私はnextjsでこれを行うことができますか?私たちはGraphSQLを使用していないので、その間のduoのアイデアとスラグページを生成する質問のように見えた.私は、どのようにnextjsがレンダリングを扱うかについて見ることに決めました.md ファイルは、私はそれがそうであることを考えれば容易ではなかった.結局、私はレンダリングされたライブラリにつまずいた.mdx ファイルは、ちょうど空想です.md JSX/TSXコードを直接彼らに注入することができますファイル!完璧で本当に面白かったので、試してみました.
私も、このアプローチ・ペアが本当にどのようにNextJsが現在のファイルに基づいてルートを貸すかについてうまく考えます.私がしなければならなかったのは.mdx ファイルをPages ディレクトリと移動localhost:8000/about それをレンダリングする.ちょうどそれが働くので、我々はもうスラグライブラリを必要としません.私も、ブルーでスタイルを整えた語を返す単純なコンポーネントをつくりました.mdx ファイル
const h2Style = {
  color: 'blue',
  textDecoration: 'none',
};

const hello = () => {
  return <h2 style={h2Style}>Hello</h2>;
};

export default hello;
import Hello from './hello';

<Hello />

## About

One of the key features[...]

驚いたことに、それはちょうど働いた.ページは明らかにスタイリングを必要とします、しかし、我々がそれのまわりで得るとき、我々はそれをまわりでまわります.クール.設定ファイルの作成next.config.js 簡単で面白い.You can see the entire PR here . うまくいけば私は依存関係を導入するために怒らない.私はこれがきちんとしたアプローチであると思います.mdx 将来のファイル(ドキュメントなど)次.(heh)
私の第2の問題は、高さと幅を小道具として受け入れて、ロゴオンコマンドを生成するロゴコンポーネントを再実装することでした.パーフェクト!NEXTJSはちょうど出て来ました.私は、リリース会議を見て、それらが自動的にバージョン10.0.0の大きなハイライトとして自動怠惰なローディングと画像の最適化について話して興奮しているので、私は新しい技術がどのように動作し、それを実装する方法について読んで熱心だった.私も興味があった.webp ファイル形式を変更するので.svg ロゴに.webp Photoshopでそれを再生する.だけでなく、画面上に驚くほどではなく、私はそれを思ったとして簡単に表示するイメージを取得します.Eslintがパスを解決することができないことに関して私と戦っているならば(たとえイメージが実際に表示されるときでも)、NextJsはちょうどイメージを全く表示していませんでした.

見つけたa library それはNextJSアプリで簡単にイメージのインポートを許可します.もう一度、私はもう一つの愚かな依存関係を導入することに躊躇しています、しかし、NextjsがCDNからイメージを輸入していなくて、問題なくローカルに彼らを輸入するのを苦労しているように、誰でも幸せにする代わりを理解することができませんでした.最終的に、コンポーネントとメインページの間の小道具を渡す方法を考え出しました.

私はprを作りましたyou can see here . その後、私もsome help from my new friend Tony (私はこれまで以上に良い開発者です)私は明らかに小道具のタイプを指定する方法を私に示しましたhere , それで、私は問題を修理して、新しいコミットをしました.トニーに感謝し、1月にお会いしましょう!活字はきちんとしているが、風変わりなものだ.
そして、それらの2つのSMOL PRSで、私が私のリリース0.4割当てのために持っているすべての時間を包みます.
リリース0.4で全体的に私はあまりにも多くの課題に直面していませんでした.私は3週間、私は小さなプログラミングの素敵な世界に自分自身を再紹介するために小さな問題の束を行うことの目標を設定した.私は5つのprsをしたかったです.その後、3、どのように終了知っている.しかし、少なくとも、私は束を学び、いつものように、それを楽しんでいた.
ああ、私がやったのですかPRのレビューhere . 私はこのマージについて本当に興奮していました.Josueは親切にも私がそれを持っていたいくつかの質問を手伝ってくれた.彼は本当にうぬぼれたやつだ.
とにかく、それは包みます.クリスマスブレークのための私の計画は、飲酒、睡眠、陽気な、デュアルブートのLinux、学習、反応、私のPCのフォーマットが含まれます.shuckin' some 8TB drives そして、私のfreenasサーバを更新して、サイバーパンクをすること.
閉じるこの動画はお気に入りから削除されています.仕事中ですが、幸いにも家から仕事をしています.
今、私は走り、明日の朝プレゼン用のグループを完成させなければなりません.
1月にこのコースの後継者に自分の進歩を見てください.OSD700 !