Website Ideas

[SaraVieira]

My thinking was to have a list you could search through these terms and also a page for each so you could in the browser type:

https://webdev.wt/ajax

And it would redirect you to the ajax one.

Each page would have these things:

• Name
• Explanation
• Use in a sentence
• Resources
• When to use

This issue is for everyone with ideas to bring them to make this website better 🎉

[hbuchel]

This could fall under resources, but maybe a link to an MDN article (https://developer.mozilla.org/en-US/ ), or somewhere that has a deep dive on the topic.

[stereobooster]

My ideas (not necessary all good, take it as brainstorm):

• category so we can separate jQuery(JS library) from airty(computer science)
• related terms or "see also"
• "kind of" relationship, for example emotion is CSS-in-JS
• picture, when appropriate, for example, like here https://developers.google.com/web/fundamentals/performance/user-centric-performance-metrics for First Paint (FP) / First Contentful Paint (FCP)
• alternative names
• disambiguations, for example hooks (as callback in library) and hooks in React
• tags (not sure about this one)

I feel like, I reinvented wiki 🤦

[stereobooster]

Also, I thought about image cards for separate pages https://webdev.wt/ajax for social networks, like they have in dev.to.

It is automatically generated. We can do this too, with puppeteer, for example. This card will have big the word for title and explanation will be in smaller text.

[terencejeong]

Just a thought, but it would be cool if the list was ordered by page views. It will be great to see what patterns emerge for people trying to get into the front-end community and how everyone can make it easier.

[jsnhall]

There will most likely be the case when a term has not been defined on the site yet. Having a way to see popular undefined terms that have been searched for would be beneficial so that they can be added.

[cdvillard]

This is definitely falling into the realm of a wiki, which I am all for. That said, I sense your goals for this project are a bit more direct, @SaraVieira? Just a list of top-shelf definitions followed by links to well-written resources, yeah?

I think there needs to be a WSWTF style guide or primer for people interested in editing content established from the get-go. Even if it's a one-pager of guidelines like not using the word you're defining in a definition, I think it can go a long way towards avoiding incorrect definitions later.

I'm also wondering about your thoughts on whether we should give individual tools definitions. I know people use them and will likely know what they are, but I feel like it should be as agnostic as possible. Like, define what 'front-end frameworks' are, but link off to other articles about Vue, Angular, and React in the resources (and only if it serves the reader to better understand the definition.)

I've seen (and have accidentally given) 'brief' explanations of topics that ended in more questions than an actual answer to the main one. So, I think a cool thing to add would be a visible section/disclaimer saying you should probably understand these topics to understand this one better, like ingredients in a recipe. Like if we're defining Node, the reader should probably know what the command line, JavaScript, and Bash are. One might say to just link to them in an article, but who wants to be halfway through an article and clicking on links to new pages?

Sorry for the thought spew. It's 11PM here, and I'm ready to be snoring.

[SaraVieira]

@hbuchel that is a great idea! That will always be one of the resources 😄

[SaraVieira]

@stereobooster I love the ideas, about some

disambiguations: I think this can be part of the see related - as the path for each "definition" would be different

• Cards: There is a Gatsby plugin for that 💯
• Tags: I think that is the same as categories so it makes sense to only use one and I will think if this can still be one in Netlufy CMS because of the relations :/

[SaraVieira]

About the search if I use Algolia that is a feature and I can get the open source plan so we can get that from Algolia without a problem and can tell people what terms are searched more and also have access to the ones that are searched and return nothing 🎉

[SaraVieira]

Gonna add Algolia to the stack 💯

[SaraVieira]

@cdvillard
I wanna start by saying I am answering this at 6 am 😂

First the style guide is a an amazing idea with some articles as inspiration. I feel like this page should also show the most searched terms that come with no results so that people can help in those if they want or write their own

About the react thing I think that will be an issue too but we can maybe fix that with categories or with relations , like Vue is related to JavaScript and web framework, does that make sense ?

[cdvillard]

@SaraVieira, it makes totally makes sense, but the implementation of it is a concern I have in mind. I know this is putting the cart before the horse, but how would we represent React/Angular/etc. in relation to a topic without a definition? Like, if we don't do definitions of branded technologies, say for example, if a topic like relational DBs is related to Postgres, do you link to Postgres' docs instead of a definition?

[microbouji]

I second (third?) the style guide idea. A good guideline with one good example and maybe a short list of DOs and DONTs will be crucial to the quality of definitions.

Furthermore maybe multiple community definitions should be accepted for one term and have voting a la stack overflow / urban dictionary?

Also: oneliners for tooltips. Each term should have an "official" very short definition (like less than 140 chars) to be used at the top of the single view page, on social cards, and especially on tooltips. Good tooltips with clickable words inside, that just replace the tooltip instead of navigating away, could mitigate the issue mentioned by @cdvillard where you have to mention five different tools in one sentence. It sucks less if each of them can be clicked to open a tooltip instead of opening a new page.

btw, I think we should definitely include definition for tools, branded or not. Directly linking to docs is the quickest way to send procrastinators like me straight into rabbit hole. Not saying we can do a better job than tool authors at describing their own products, but ours will certainly have less fluff like how many years went into the development of Postgres. And even if our definition of say Puppeteer is also "Headless Chrome Node API" you'd at least have three tooltips right in that sentence potentially saving you three google searches.

I'm writing this at midday, so I really have no justifications for my thought spew ¯\_(ツ)_/¯

[stereobooster]

More ideas:

• category "similar, but different". For example, immutability vs referential transparency or authorisation vs authentication
• category "confusing js". For example, this, hoisting, type coercion rules