vitonsky / blog Goto Github PK

Use posts with the same tags if possible or just pick random posts

• Add rule to sort imports
• Run linter on CI

Obey the closeness rule

• Write post about blog
• Update readme and description
• Add info about how to build it

Use https://www.npmjs.com/package/next-seo package for seo features management

On main page https://vitonsky.net/ post https://vitonsky.net/blog/2022/12/03/interface-expressiveness are have incorrect date, that lead to mismatch while hydration

• Update links style
• Update footer

Build are down, so we should update packages.

I see we have problem with maintenance own solution for blog, so I tried to use docusaurus as alternative. Unfortunately it is hard to customize, i even can't use custom layout, or at least set alias /blog that would contain a blog data from / url. So better to maintain own solution.

Also i tried https://astro.build/ but it is not blazing fast to explore, they have manual about how to build your own site. I prefer to not waste time twice, so this blog will continue to work on nextjs for a time.

I decide to use yarn, because it is simply to manage packages in multiple directories

It's like tweet, but for mastodon

Service https://latexonline.cc/ is down currently. We should ensure all the docs are available for a clients, so let's compile any PDF files while build and then host it in in public directory

Required to make references to headers

Use native font style -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif

Try docusaurus or astro

To give feedback

It seems we lost a post https://vitonsky.net/blog/2023/09/08/typescript-and-code-quality/

I see that we have files in repository, so probably we have bug in code. Let's try to fix it

Currently we use next-mdx-remote package to compile MD/MDX files to react view.
This package compile markdown text to a javascript that execute in eval later.

This approach is potentially dangerous, because next-mdx-remote can insert any code and eval it later.

We have to compile markdown text to abstract syntax tree and render this tree later

{
	"pageProps": {
		"post": {
			"url": "/blog/2022/05/22/first-post",
			"source": {
				"compiledSource": "/*@jsxRuntime automatic @jsxImportSource react*/\nconst {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n  const _components = Object.assign({\n    p: \"p\"\n  }, _provideComponents(), props.components);\n  return _jsxs(_Fragment, {\n    children: [_jsx(_components.p, {\n      children: \"Welcome to my blog. I've create it to expressing my opinion, primarily about programming.\"\n    }), \"\\n\", _jsx(_components.p, {\n      children: \"My plan are writing ideas to my blog and refer other people here later, to avoid repeating my point many times.\"\n    }), \"\\n\", _jsx(_components.p, {\n      children: \"Today, social media are hide posts of people with undesirable points of view and even remove all their content. Users is not have control on own posts. This is why i create my blog instead of account on popular site.\"\n    })]\n  });\n}\nfunction MDXContent(props = {}) {\n  const {wrapper: MDXLayout} = Object.assign({}, _provideComponents(), props.components);\n  return MDXLayout ? _jsx(MDXLayout, Object.assign({}, props, {\n    children: _jsx(_createMdxContent, props)\n  })) : _createMdxContent(props);\n}\nreturn {\n  default: MDXContent\n};\n",
				"scope": {}
			},
			"previewText": "Welcome to my blog. I've create it to expressing my opinion, primarily about programming.",
			"readingTime": {
				"minutes": 0.365,
				"words": 73
			},
			"date": 1653175800000,
			"title": "First post",
			"previewImage": null,
			"coverImage": null,
			"description": null,
			"lang": null,
			"tags": [],
			"keywords": []
		}
	},
	"__N_SSG": true
}

Move common code to a special directory and never import server code to a client and vice versa

NPM scripts too long and unmaintainable. Move logic to a task runner

• Refactor posts processor
• Make API stable
• Fix bug when rename post and attachment with relative path delete and make "unavailable"
• Write roadmap how to unify server to use in other projects about SSG

Lint typescript, typos, analyze code

Currently we generate RSS and sitemap in site/pages/index.tsx and copy attachments on server side.
Let's move any logic about static files to one place

To improve maintainability

• Add link to linkedin
• Add resume

Build files for each commit in PR, but deploy only by change some files by push in master

Let's split logic to API server and blog frontend + BFF.

We should have 3 directory:

• content: posts, images, attachments
• server: content processing
• site: frontend and all things to generate static site

Something like this for inspiration https://github.com/bmshamsnahid/Markdown-Blog-Parser
We can make package from this.

Server responsibility:

• Process a md/mdx files to any formats
• Provide an API to build any site structure

Features:

• Process files as once as and in watch mode
• Extensible API
• User can specify parameters in config, including basePath for site, path to directory with content and fsRoot which limit top directory to access to content files

We have to compress images, but keep legacy urls.

We may compress images, but use hash of original file as before