gaearon / overreacted.io Goto Github PK

Some of languages like Persian and Arabic are rtl languages so for translating posts to them we need to do some changes on layout to support. I can help to making layout RTL-friendly and translate posts to Persian if you appreciate it.

## `code`

looks funny

On iPhone safari inline code font is too large compared to surrounding text. Need to bump down. But for desktop we should keep current size.

Link that points to "The Elements of UI Engineering" in "Things I Don’t Know as of 2018" causes site to refresh.

https://github.com/gaearon/overreacted.io/blame/master/src/pages/things-i-dont-know-as-of-2018/index.md#L96

I think maybe instead of prev/next links there should be a way to associate posts with other posts (e.g. "related" list in frontmatter header). Then they would show up below the post. Maybe even always suggest just one (to reduce choice anxiety). Could remember which ones you've read in local storage and pick one out of the related list that you haven't read yet, at least on this device.

Edit links is pointing to: [...]/pages/<filename>.<lang>.md
After #121 they must point to [...]/pages/<filename>/<filename>.<lang>.md

- [...]/pages/things-i-dont-know-as-of-2018.pt-br.md
+ [...]/pages/things-i-dont-know-as-of-2018/things-i-dont-know-as-of-2018.pt-br.md

Currently translation PRs create a bunch of merge conflicts because langs has to added to each translation file separately. It's easy for them to get out of sync.

It would be nice if langs only needed to be declared in the English original Markdown file (or, ideally, not declared at all, but deduced from all files with the same name before language suffix extensions).

We should also sort them alphabetically when enumerating them on the page. (I've done this one)

Seems like there's no fancy preview

I don't want the format script in package.json to reformat Prettier.

It would be great if users were able to like the posts.

hey Dan, pretty nice blog 🎉

i'm just unsure if you want to bring your posts from other sources to this one, if you are willing to do this, I can gladly help with it 🤗 . I think many people, like me, would rather prefer referencing overreacted than medium — for example.

It would be great if users were able to comment on the posts and start discussions.

Since there will be translations for articles, we need more supported languages for fonts. As far as I know, typefaces have support for latin language only right now. We can use directly google fonts maybe?

Same one I'm using for front page.

Currently they're in src/pages. That's confusing. Would be nice to have a separate folder with content. Images should be scoped to a directory with blog post.

If I link from one article that has e.g. Korean translation to another that also has it, it would be nice if they automatically chose the Korean version.

Of course we can modify Markdown directly to do it but that's too error-prone.

At least on iOS, line highlight doesn't work for long lines (parts to the right are not highlighted).

There seems to be a fix mentioned in https://www.gatsbyjs.org/packages/gatsby-remark-prismjs/:

We saw others fix that problem and decided to do so, too. Just add the following CSS along your PrismJS theme and the styles for .gatsby-highlight-code-line

I think I tried those instructions but they broke something and I didn't finish it. Feel free to PR!

My file is in https://github.com/gaearon/overreacted.io/blob/master/src/utils/theme.css

I heard it's broken but I don't know why or how to fix it yet

This happens on newsletter confirm page and also thanks page.

It would be nice to ensure some consistency between the quality of different translations. It's great if there could be a person or a group of volunteers for every language who translate and/or provide reviews on translations.

I'm going to be translating posts into Russian myself.

It seems like a few people already are actively helping with:

• French @tdd
• Traditional Chinese @chloewlin
• Spanish @carburo

I didn't look through all PRs so there's probably many more people who actively reviewed and helped improve translations. If you'd like to volunteer to maintain your language, please let me know and I'll add you here.

Ideally I think we'd have a group of two or three maintainers per language. (Although others are welcome to help out!) If you'd like to volunteer please let me know in this thread.

Regarding quality. Meaning is important. Meaning shouldn't be distorted. However translations shouldn't feel mechanical. If you have a choice between following the original word-for-word or expressing the same meaning in a much idiomatic way, go for the idiom. English is somewhat noun-friendly but conglomerations of nouns can be unreadable in some other languages. My suggestion is that you read a sentence, think how you'd express the same thought in yours, and then write down the sentence you got.

(My Russian translations will be even more different but that's just because I can't write the same exact thing twice. I'm OK with Ukrainian and other culturally close languages to be translated from my Russian versions instead of English.)

Any thoughts? As always, huge thanks for helping with this. If you told me there'd be this vibrant translator community for my blog a few weeks ago I'd think you're kidding me.

Came across https://overreacted.io/things-i-dont-know-as-of-2018/?fbclid=IwAR1kKjMRUwDL8iIHfltfyJSivQLF3kAXgMz73O_hUR0_NzmTtDPDsspeOZw aka https://github.com/gaearon/overreacted.io/edit/master/src/pages/things-i-dont-know-as-of-2018.md

Found it through a social media post someone shared. Was great but I think it would be much more informative to maybe add a bit about context about what you are working on, how long you have been at programming/software/whatever and maybe general things that you do know well. Otherwise it is currently just like a list of a lot of things that one doesn't know which we know is a lot bigger than what one individual does know :)

At least a fallback that shows a link to file an issue here.

Congrats on your new blog, the posts are great so far.

Some time ago I asked this question on StackOverflow and didn't get a satisfactory answer. I ended up answering and accepting my own answer, because that's the closest I ever got to one.

I think you might know better?

Original question follows

Right now, this is the way I understand event handling in React:

1. The native event capture phase happens
2. The native event reaches target
3. The native event bubbles back up
4. React catches it at the document layer
5. React puts it in its EventPluginHub
6. React simulates another full capture/bubble roundtrip for the SyntheticEvent
7. React runs the handlers you built in your code

If my understanding of React internals is correct, and taking into account this part of the HTML spec:

Event objects are dispatched to an event target. But before dispatch
can begin, the event object’s propagation path must first be
determined.

Does React wait until the event bubbles up to document to create its SyntheticEvent? And if so, why? In the first step of the event's life, all info about its propagation path is known, so they could do it there.

Long Code in heading ex: componentShouldUpdate is breaking responsive-ness on small phones

As README.md suggested,

I cannot run it. Causing errors. Am i missing anything, or do we need to update README.md ?

EDITED:

hey what code highlighting color scheme is that?

I was excited to get a new Overreacted post in my RSS reader this morning, but discovered that it was a translation of an existing post. Would it be possible to skip translated posts when building the RSS feed?

Note to self 📝

• make sure lang is in <html>
• filter list of posts in config file

Currently I have to run

yarn build
cd public
now alias $(now) overreacted.io

This is annoying. I want it to be done automatically on commit but I couldn't figure out how to write a correct now.json.

1. Revert ec340fe
2. yarn build

The public folder post is broken — images don't exist at generated path. I don't know why. Works in dev.

cc @DSchau

Currently this script is synchronous:

This is not good. I tried to add defer to it but I think this broke the form. We need to figure out how to load it asynchronously. It's fine if client side validation is missing while script is loading but the form should work
.

For some reason, the page https://overreacted.io/optimized-for-change/ isn't available on the repository hence the "Edit on Github" link points to 404 on Github.

I was thinking about adding some kind of credit for people who provide fixes, translations, etc.

Would it be possible to add "translation submitted by ..." or something similar?

For other types of contributions I was thinking about adding this project to README:
https://github.com/all-contributors/all-contributors

In RSS feed, links like /stuff are left as /stuff. When email subscription service picks them up, the links end up broken because it doesn't apply base domain to them.

It would be nice if we could somehow hook into Gatsby RSS feed plugin and prepend domain-less links with the site domain.

For typos etc. Should link to GitHub editing interface.

We know that when say obj.foo, JavaScript actually looks for foo in obj, obj.proto, object.proto.proto, and so on.

It might be : obj.proto.proto?

Hello! Your blog is awesome! Don't you mind if I translate it to Russian?

Looking for screenshot (captured on Chrome Windows)

The link as of now open the mobile site even on desktops. Removing mobile. from the URL should fix it.

I'd like to try using MDX so I can embed live snippets in the future. I tried to do it with Gatsby and utterly failed. (I couldn't get it working at all.)

If somebody can convert existing stuff to MDX (while keeping the functionality in previous posts exactly the same) that would be great.

It's cool that this exists: https://overreacted.io/ko/

But ideally it would be an actual page that explains these are translations, and shows a list.

Dunno how

Dark mode toggle does not fit on screen that is as narrow as on small iPhones (5, 5s, SE), which makes page scrollable horizontally.

Great Blog, Dan I have every single post of yours, I was recently reading about tail call optimisation in JS strict mode. I would like to know if React.createElement is implemented using tail call optimisation, since it is a recursive call , wouldn't it cause a stack overflow error.

Should be an easy fix. (See black icon to the left of the text)

But I don't know if we can fix without forking that autolink plugin in this repo. FWIW I that need for another thing anyway so it's fine if we just copy paste it here.

Since adding translations, yarn build is failing.

This hack is ridiculous.

Would be nice to somehow change the layout so we don't have to "guess" here.

Posts in other languages, like 2018年，那些我所不知道的技術, have a slug specifically for their languages, but the lang attribute on the <html> element is fixed. By setting the lang attribute to the correct language, the page conveys what language it is in, so that programs have an easy way to determine it. This is beneficial for assistive technologies (to use the right voice) and can be used by other tools, too.

i wondered if it's worth it, or if make any sense to you, implementing mdx or at least some kind of cms (probably netlify-cms), i have some experience in it — even on more complex sites like my university's news lab and would be glad to tackle this too.

Hey, @gaearon!

We are about to publish the translation to Portuguese of your post on our company blog, as requested on #88. We thought that it would make better sense to publish it with a slightly adapted title, due to the temporal circumstances: "Coisas que eu não sabia em pleno 2018 - por Dan Abramov", which literally translating means "Things I Didn't Know as of 2018 - By Dan Abramov". Are you ok with that?

Also, here is the promotion image we intend to use with it: