onesword0618/log.theater

Personal Blog

log.theater's Issues

Add: `icon`

Background

Re-editing Icon.

New File

• icon.tsx

Fix: Accessibility

Background

Target Files

footer.tsx
tag.tsx
entryTemplate.css
footer.css

Add: component test

Update: `useSiteMetaData`

Background

Re-editing useSiteMetaData.

Target Files

useSiteMetaData.ts

Add: .env

https://www.gatsbyjs.com/docs/how-to/local-development/environment-variables/

Fix: head component.

Background

Re-editing Head.

Target Files

head.tsx

Update: 記事の詳細のカテゴリの位置を修正する

Update : `about` page.

Background

Re-editing About.

Target Files

about.tsx

Update: fortawesome icon.

https://fontawesome.com/docs/web/use-with/react/add-icons

Update: `settings.json`

Background

Change the color scheme of the editor you are using.
Change plugin settings.

Target File

.vscode/settings.json

FYI

• plugin
  https://github.com/doi/fileheadercomment

Update: Configuration files for libraries used in development.

Background

I have decided to review the configuration values in the configuration file used during development.

Target Files

• .editorconfig
• .eslintrc.json
• .prettierignore
• package.json
• package-lock.json

Contents

.prettierignore

• exclude from target gatsby-types.d.ts

.eslintrc.json

• add import/resolver 's setting
• add rule set

.editorconfig

• add target file .js

package.json

• version up
• updating Dependent Packages
• update dependent packages during development
• library version updates
• script section rewrite

library details.
In

• eslint-import-resolver-typescript

Out

• esm
• gatsby-plugin-typegen
• @graphql-codegen/typescript

Add: .nvmrc

https://www.gatsbyjs.com/docs/how-to/cloud/set-node-version/

Update : `404` page.

Background

Re-editing 404.

Target Files

404.tsx

Update: `article`

Background

Re-editing Article.

Target Files

article.tsx

Update : `introduce` page.

Background

Re-editing Introduce.

Target Files

introduce.tsx

Update:Change Icons..

Update: 記事の内容デザインを更新する

Update: 前後の記事を案内するボタンの修正

Update : `cookie` page.

Background

Re-editing cookie.

Target Files

Cookie.tsx

Update: Meta Tags

Background

Updating Meta Tags.
Updateing ogp.

Target File

head.tsx

contents

Redefine whether to receive from an argument or a hook.

FYI

open graph protocol
https://ogp.me/
twitter
https://developer.twitter.com/en/docs/twitter-for-websites/cards/guides/getting-started
https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/summary-card-with-large-image
facebook
https://developers.facebook.com/docs/sharing/webmasters/#markup

Add: React Icons

Background

Re-editing icon.

Target Files

icon.tsx

Update: `footer`

Background

Re-editing Footer.

Target Files

• footer.tsx

update: grid css system.

background

using grid .

Update: `date`

Background

Re-editing Date.

Target Files

• date.tsx

Add: 目次機能を追加

Add: アーキテクチャについて記載したドキュメントを作成する

Update: entry design card.

Update : `index` page.

Background

Re-editing index.

Target Files

index.tsx

Update : `activity` page.

Background

Re-editing Activity.

Target Files

activity.tsx

Fix: headの修正

Add: ライブラリの参考資料を追加する

Update: `layout`

Background

Re-editing Layout.

Target Files

layout.tsx

Update: `Tag` component

Background

Extract the process of icon creation.

Target Files

tag.tsx

contents

write import section.

Update: `Head` component

Background

change gatsby-plugin-react-helmet → Gatsby Head API

Target Files

head.tsx
package.json
gatsby-config.ts

contents

• head,tsx
  write return section.

• gatsby-config.ts
  remove plugin gatsby-plugin-react-helmet

library

Out
gatsby-plugin-react-helmet
@types/react-helmet

Update: Changed to work temporarily.

Background

Remove user define file.
Changed to work temporarily.

Targe Files

components

• article.tsx
• date.tsx
• footer.tsx
• head.tsx
• header.tsx
• layout.tsx
• tag.tsx

pages

• index.tsx
• about.tsx
• 404.tsx
• activity.tsx
• introduce.tsx
• terms.tsx
• cookie.tsx
• privacy.tsx

templates

• entryTemplate.tsx
• tagTemplate.tsx

type define file

• typs.ts → gatsby-type.d.ts

Update : `terms` page.

Background

Re-editing Terms.

Target Files

terms.tsx

Update: Specific configuration file rewrite.

Background

gatsby-*.js → gatsby-*.ts.

custom-configuration
gatsby-config.js → gatsby-config.ts
I can now convert from [email protected] .

gatsby-node.js → gatsby-node.ts
I can now convert from [email protected] .

gatsby-browser.js → gatsby-browser.ts
I can now convert from [email protected]

Target Files

• gathby-config.js
• gathby-node.js
• gatsby-browser.js

New File

• babel.config.json

custimize configuration.

Update File

• tsconfig.json

unnecessary setting

FYI

https://www.gatsbyjs.com/docs/how-to/local-development/graphql-typegen/
https://www.gatsbyjs.com/docs/how-to/custom-configuration/babel/#how-to-use-a-custom-babelrc-file
https://babeljs.io/docs/config-files#file-relative-configuration

Update: `header`

Background

Re-editing Header.

Target Files

• header.tsx

Update: CSS file.

Background

Re-editing css files.

Target Files

article.css
code-block.css
entryTemplate.css
footer.css
icon.css

Add: siteMetadata hooks

Background

Created hook so that siteMetadata can be used around.

Target

• useSiteMetaData.ts

Fix: Deletion of external codes

Background

Moved items used on external sites to environment variables.

Target Files

• useSiteMetaData.ts
• gatsby-config.ts

Add: コンテンツのガイドラインを作成する

Add: 関連記事の追加

Add: managing-environment-variables

https://www.gatsbyjs.com/docs/reference/cloud/managing-environment-variables/

Update : `entryTemplate` template

Background

Re-editing entryTemplate.

Target Files

entryTemplate.tsx

Add: webfonts

https://www.gatsbyjs.com/docs/how-to/styling/using-web-fonts/

Update : `tag template.`

Background

Re-editing TagTemplate.

Target Files

tagTemplate.tsx

Add: notifications

https://www.gatsbyjs.com/docs/how-to/cloud/outgoing-notifications/

Update : `privacy` page.

Background

Re-editing Privacy.

Target Files

privacy.tsx

Update: css → module.css

https://www.gatsbyjs.com/docs/tutorial/getting-started/part-2/#style-components-with-css-modules

https://www.gatsbyjs.com/docs/how-to/styling/css-modules#when-to-use-css-modules

https://www.gatsbyjs.com/plugins/@mediacurrent/gatsby-plugin-silence-css-order-warning/