Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!
Kent's Homepage
Home Page: http://kentcdodds.com
License: MIT License
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!
So people can find the kind of stuff they want to find better
Figure out how to make sure there are spaces for markdown formatted like this:
[this is a link](https://google.com/a-very-long-link-that-takes-an-entire-line-by-itself)
[this is another link](https://google.com/which-is-also-a-very-long-link-that-takes-an-entire-line-by-itself)
This will be rendered as:
<a href="https://google.com/a-very-long-link-that-takes-an-entire-line-by-itself">this is a link</a><a href="https://google.com/which-is-also-a-very-long-link-that-takes-an-entire-line-by-itself">this is another link</a>
The solution is to add a space to the end of the first line or place them on the same line with a space between them, but prettier formats it the way it is above.
So I think this is an issue with how mdx converts those. I'm not sure how to solve this problem...
404
Ideally, the content pulled in would be able to have a preview/snippet to make a more visually appealing display
Possible Resources:
By the way site looks grt π
But one thing I noticed while loading was @kentcdodds your avatar image in home page takes time to load although you have the service worker
to cache the subsequent request. But initial load is could be little faster if we optimize the kent.png image in hero folder.
Attaching an optimized version of it.
Its 127KB
. Original was around 500KB
Nice one on the article. Here, it did seem like there were 2 public effect hooks and 1 mystery hook.
References to that:
All three of these
some are more optimal than others
and use the other two hooks
the difference between the other two
I wanted to edit and send in a PR, but I can't write like you π
404
<figcaption />
texts are not styled
I didn't create a PR for this as I did for the PR
#64 because this would require code transformation change.
Url not found
Hitting kentcdodds.com gives me a 404.
@all-contributors please add @j-f1 for content
404
404
url not found
NOT FOUND
You just hit a route that doesn't exist... the sadness.
404
Using this to add a few people who have contributed to this site.
404
When navigating to https://kentcdodds.com/blog/
(note trailing slash) an error is thrown by the browser telling the user that This site canβt be reached
. If you remove the trailing slash, you are directed to the blog as expected.
This was brought to my attention via Google by clicking on the link in the screenshot:
Once at the blog it is great π Thanks for the awesome content Kent!
@all-contributors, please add @aganglada for bugs
@allcontributors[bot] please add @markerikson for content
See the blog post: React/JSX as a server-side templating language
Markdown file on Github
Blog post on Netlify
Blog post on Medium
It looks like the importer is inserting extra >
characters.
> _Another note:_ >
> [_I've been teasing_](https://twitter.com/kentcdodds/status/1041712678970875904) >
> _about something big that I have coming. I'm totally not joking. I'm working
> on something really huge and y'all will be the first to know about it. Stay
> tuned. It's weeks away and I think you're going to love it._
The problem arises when there is a scrollbar present. More here
However, you will notice that when a highlighted line runs wider than the surrounding code block container (causing a horizontal scrollbar), its background wonβt be drawn for the initially hidden, overflowing part. :(
This website isn't using gatsby-remark-prismjs
but the problem is similar
I see you are "rolling your own" blogging framework with simple react views and routes. Having you looked at gatsby, Metalsmith or Hexo? The setup is pretty extensive and not as expressive as what you are able to do with rolling your own, do you have any thoughts on how to fix this? I was talking to @vonbearshark about how if Jekyll was simply translated one to one to JS it would fit 99.9% of use cases.
404
Hey Kent!
Congrats for the new website look, it looks cool π
/
in all guid
s right after the base domain which (while works fine) could cause a tiny problem for RSS readers when you later (eventually ) fix it. So, I suggest to fix it now ;)Access-Control-Allow-Origin: *
for the feed URL so that client-side RSS reader users (like me) could access your posts.<?xml version="1.0" encoding="UTF-8"?>
<rss
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:atom="http://www.w3.org/2005/Atom" version="2.0">
<channel>
<title>
<![CDATA[Kent C. Dodds]]>
</title>
<description>
<![CDATA[Come check out how Kent C. Dodds can help you level up your career as a software engineer.]]>
</description>
<link>https://kentcdodds.com</link>
<generator>RSS for Node</generator>
<lastBuildDate>Sun, 10 Feb 2019 15:55:45 GMT</lastBuildDate>
<item>
<title>
<![CDATA[Testing Implementation Details]]>
</title>
<description>
<![CDATA[Last year when I was using enzyme (like everyone else at the time), I stepped
carefully around certain APIs in enzyme. I
completely avoided shallow rendering ,
never used APIs like instance() , state() , or find('ComponentName') . And
in codeβ¦]]>
</description>
<link>https://kentcdodds.com//blog/testing-implementation-details</link>
<guid isPermaLink="false">https://kentcdodds.com//blog/testing-implementation-details</guid>
<pubDate>Mon, 19 Nov 2018 00:00:00 GMT</pubDate>
</item>
<item>
<title>
<![CDATA[How to React]]>
</title>
<description>
<![CDATA[This last week I gave
a talk at called "How to React."
It's basically an updated version of
Pete Hunt's
react-howto GitHub repo. I thought
I'd just jot down a few things from this talk for you to enjoy in your inbox
today :) Abstraction Let'sβ¦]]>
</description>
<link>https://kentcdodds.com//blog/how-to-react</link>
<guid isPermaLink="false">https://kentcdodds.com//blog/how-to-react</guid>
<pubDate>Mon, 16 Apr 2018 00:00:00 GMT</pubDate>
</item>
</channel>
</rss>
I'd expect the RSS feed to include something like <content:encoded/>
tag (since the necessary namespace is already declared ) that includes an encoded representation of the full post content. See Dan's blog for example.
Continue being awesome :)
404
It's not an issue, but I'd like to know how you use the fragment from here
To ue here:
It's puzzling me how you get the fragments to 'load' and then use them in the index page, tell me @kentcdodds can you use the childImageSharp { ... }
in the GraphiQL Gatsby explorer?
The code blocks have a max width and don't wrap. Something is missing like white-space: pre-wrap;
or code samples with lines already wrapped down to the mobile breakpoint. Not sure of the solution, just wanted to mention that readability issue. (especially for those without easy horizontal scrolling device like myself today)
Other than that, thanks for the great content, I'm always happy to read your new stuff π
404
This blog post is about mediums multiple claps feature.... As you are moving from Medium, not sure if you need this one, but totally your choice.
Sometimes when this blog post loads, the link points to https://firstpr.me/#kentcdodds
Other times when it loads, it points to https://egghead.io/courses/how-to-write-an-open-source-javascript-library.
Guessing this is unintended behavior?
I was going to submit a PR to fix it but in the actual index.md
file, you have the correct link so I'm not sure what's going on π€·πΌββοΈ
I opened the post in Firefox Developer Edition from your newsletter. Same thing happens in Chrome: http://recordit.co/EkrbLUOs6x
When converting all of @CompuIves' Medium posts over to @codesandbox' blog, I copy-pasted the remark-embedder
. (see codesandbox/codesandbox-client#2011)
When looking at all the pages I came across a bug with the Twitter embed when the username contains 2 underscores (_
).
When I try to embed the following Tweet, I just see the link with an italic d
instead of the Tweet card itself:
https://twitter.com/brian_d_vaughn/status/901488766581227520
An example can be seen at https://pr2011.build.csb.dev/post/creating-a-parallel-offline-extensible-browser-based-bundler-for-codesandbox
404
Hey @kentcdodds!
I miss highlighting text in your detailed blogposts on medium. So I thought it'd be cool to be able to highlight text in the blogposts, and show a popper, containing, for example, twitter share icon, which will automatically pick selected text and open twitter box, pre filled with template text.
Using a useTextSelection
hook, which would return text and position of the text, which can be consumed for example by react-popper, wired with mousedown, mouseup, shift + keydown and shift + keyup events.
Would you like something like that? I've just started something like that over here (https://codesandbox.io/s/usetextselection-react-hook-wip-g0ksf
), thinking you might.
Reference β https://codepen.io/FezVrasta/pen/YEVrGP
Here's the code that used to be there: kentcdodds/kentcdodds.com@de5dd06
Waiting on (or need to contribute a fix to) this: ChristopherBiscardi/gatsby-mdx#295
The other pages, like talks
, have no issue with this
Note that the first result in the google for your blog, uses trailing slash
Hey Kent,
I'm also starting a blog, and was wondering what's the pros/cons of adding comments?
Seeing you've decided not to add them (and @gaearon as well on overreacted.io).
Is a Twitter thread really a better experience vs. in site comments or Disqus?
Asking here in case other people would be interested in this as well.
Thanks!
Related:
gaearon/overreacted.io#7
So people can find what they want to find better.
404
404
blog/control-props-vs-state-reducers/index.md
π½οΈ Preview:
π» Code:
![gif of the rendered component showing an input and toggle that sync their state](./images/toggle1.gif)
π
Joel Hooks did this:
joelhooks/joelhooks-com@f2dd4e3
joelhooks/joelhooks-com@da4eafa
joelhooks/joelhooks-com@ded6a25
There's also: https://twitter.com/jlengstorf/status/1100158852073279488
Gotta figure out what works best for me and make it happen.
There's a little oddity in your reset.js that renders list bullets in markdown documents above the list item if the text takes the full width:
Not sure if you want it that way, if not I solved it by changing the list-style-position
in reset.js:
ul, ol {
list-style-position: outside;
margin-left: 1em;
font-size: ${typography.baseFontSize};
}
Which renders:
I was wondering if you're willing to extract the remark-embedder
plugin into it's own package, so this could be used in other projects without just copy-pasting the files?
This component recieves date
as 'yyyy-mm-dd'
and uses that mm
in the Date constructor where it should be a monthIndex
(from 0 to 11).
function FutureTime({date: dateString}) {
const date = new Date(...dateString.split('-'))
const isFuture = date > new Date()
return (
<span>
<time>{dateString}</time>
<small css={{opacity: '0.8'}}>{isFuture ? ' future β‘οΈ' : null}</small>
</span>
)
}
This results in having 1 month difference between the real talk/workshop date and the one that is used to compare if it is future or not.
404
Following article is missing two CodeSandbox sandboxes.
You can see that the HTML is missing the Sandbox code.
Compare the source
article with the destination
articles.
The destination
article is missing two Sandboxes present in the source article.
Hello Sir, I am learning with you, and found your blog is enhanced fork of eggheadio starter. I'm so inspired by this. As I'm learning, I want to write some articles with the forked version & deploy it over netlify. I tried to deploy with the minimal version(removing many unwanted things) as well as with original source code.
Unfortunately, I never able to succeed with deployment over netlify, no matter how many times I refactored it and tried again. Might, I'm missing something either some important stuff or may be some credentials in .env
or .netlify
file, or something else.
Can you please help me to make lite version of blog, lite not as eggheadio starter but as enriched as your blog with less dependencies, so everyone from us can deploy their blog easily.
Hey Kent,
first of all a huge Thank You for opening up this blog and giving us opportunity to learn and reuse!
I see a warning in your code that I can't quite put my fingers on. When running yarn dev
and edit a page so it gets updated in the browser, I see this error:
info changed file at /d/entw/www/kentcdodds.com/content/blog/react-strict-mode/index.md
βΉ ο½’wdmο½£: Compiling...
warning Action createPage was called outside of its expected asynchronous lifecycle createPages in default-site-plugin.
Ensure that you return a Promise from createPages and are awaiting any asynchronous method invocations (like graphql or http requests).
For more info and debugging tips: see https://gatsby.app/sync-actions
File /d/entw/www/kentcdodds.com/gatsby-node.js:25:5
23 | }
24 |
> 25 | createPage({
| ^
26 | path: pagePath,
27 | component: path.resolve(`./src/templates/post.js`),
28 | context: {
As far as I can tell the function is called in an async context, I'm not sure what's missing. The update works fine, it's just that message that appears.
Is this just a weird combination of HMR and gatsby compiler interfering?
Thanks again,
Torsten.
I've noticed that you have some broken links that point to your post on Medium which doesn't exist anymore.
For example in Application State Management post:
that points to https://medium.com/dailyjs/reacts-%EF%B8%8F-new-context-api-70c9fe01596b
.
Do you want me to PR with fixed links (4 more places)?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.