itsuka

I'm not sure if it has already been implemented, but I wish someone would implement a blocker for Twitter Blue that excludes legacy verified accounts and people you follow/on your list. We have the necessary data to implement this: https://gist.github.com/travisbrown/b50d6745298cccd6b1f4697e...

This project from UCSD might inspire you: https://creativity.ucsd.edu/ai

Thank you for sharing.

I also have a list on https://github.com/itsuka-dev/awesome-chatgpt-ui, and I noticed that there are a few clients on your list that I missed.

It appears that the issue only affects pages containing a code editor (and Firefox-only).

I did a quick check and found that the editor is based on gfxfundamentals/live-editor, and it is doing stuff I'm not familiar with, such as injecting a blob for each editor and using some URL params hacks. I'm not sure what the issue is, but you can take a look at editor.js if you want to dig deeper.

What's certain is that you'll need to hit the back button 1 + n times (n being the number of editors on the page).

[edit] I have opened a GitHub issue for this

I don't see any issues with this particular code (although for larger sizes, there may be an accessibility issue related to zooming). In general, I would recommend avoiding the use of vw-only units because the computed value may not change with zoom.

I learned this from https://adrianroselli.com/2019/12/responsive-type-and-zoom.h...

> It's especially powerful coupled with the ease of use of the supabase platform

Just as you said, I followed their Clippy tutorial (which utilizes pgvector and OpenAI embedding) and was able to spin up a document-based chatbot quickly. In my specific use case, I stored portions of my knowledge base as embeddings in a normal Postgres table. The next step would be to implement a Row-Level Security for extra security (in case I screwed up somewhere). Thankfully, all my data and auth info are integrated with Supabase, so it's straightforward to do.

I'm gathering open source ChatGPT UIs at: https://github.com/itsuka-dev/awesome-chatgpt-ui

I think the UI that best meets your requirements is https://github.com/WongSaang/chatgpt-ui (django backend, multiple user auth, streaming support)

If you find a better UI that is not on the list, I would appreciate it if you could let me know so that I can update the list.

This is a dupe of an earlier post: https://news.ycombinator.com/item?id=35365932

Announcement thread: https://twitter.com/TwitterDev/status/1641222782594990080

Twitter community: https://twittercommunity.com/t/announcing-new-access-tiers-f...

New React docs recommends Next, and Next will soon recommend Tailwind in create-next-app (still in canary). https://twitter.com/timneutkens/status/1636654046474805249

> create-next-app now asks if you want to start with Tailwind CSS instead of CSS Modules.

I just started putting together these Chat API-based UIs in this repo, in case anyone's interested: https://github.com/itsuka-dev/awesome-chatgpt-ui

Is using embedding + retrieval plugin a potential solution in this case? (honest question - I don't have expertise in this area). There are many helpful explanations on Three.js Discourse forum, Three.js/Pmndrs Discord, official docs, blogs, and private resources like books and course materials. If someone could create embeddings for all of these resources and make it accessible via plugin, we could get more accurate and up-to-date answers (I noticed that GPT-3.5 occasionally produce deprecated code like THREE.Geometry, while GPT-4 seems to handle it better). Practically, private resources must be excluded.

Nice! I would like to see more examples out there that do not limit the experience to only a text/chat interface. It is becoming tiring to repeatedly add extra prompts and format the input/output manually.

I found that some workflows can be executed more efficiently by using GUI/form controls (like the "simplify" button for proofreader). Node-based UIs would also be ideal for some design-related tasks. Builders have already started experimenting with these, I guess, and I'm excited to see what they come up with.

If you can only work with GPT-3.5 model, the prompt that bumbledraven shared may still produce some explanations and provide no syntax highlighting. To solve this, you can add: "Skip prose. Skip explanation. Answer in a single code block in markdown."

Also, if you're using the playground, I'd recommend keeping the temperature low (I normally set it to 0 for this task). This will prevent any extra information such as test data, from being included. From my experience, setting the prompt I shared earlier as the system prompt produced more consistent results. However, whatever I shared is based on my own trial & error, so I'm not sure if this will work for you/in general.

I don't think there's anything unique about my client, and since I'm too embarrassed to open-source my spaghetti code, I'm sharing this demo instead: https://nitter.net/itsuka_dev/status/1639631487493632000#m

Sorry, I can't recommend any other clients since I don't use them.

If your company's policy permits accessing ChatGPT through the API, you can assess clients from awesome lists like this one: https://github.com/humanloop/awesome-chatgpt I've seen companies use Slack bots since they are easy to implement/integrate with.

I'm sorry, I think I might have used "privilege escalation" in a confusing way here. To clarify, these services sometimes need access to the surrounding environment to enhance the AI's context and prevent misuse. For example, according to the Chrome Web Store, Grammarly may need to monitor network, mouse, and keystrokes (from non-sensitive input fields), as well as location data. Meanwhile, Copilot may require access to adjacent code or open tabs, which I believe is now configurable. As I'm not a security researcher or user of these products, I may get these details wrong.

It is hinting GPT to skip generating unimportant texts such as filler words, while still maintaining coherence in the output.

For example, if I asked GPT "How to make bibimbap?" with the prompt "skip prose", it will give concise list of ingredients and instructions in about ~250 tokens [1]. Without the prompt, it would first explain what bibimbap is and then give a slightly longer instructions, totaling around ~360 tokens.

[1] A token is like a building block of a sentence - it can be a word, a punctuation mark, a number, or even a combination of words. In case you didn't know, Chat API users are charged based on the number of tokens used. So we try to keep it to a minimum.

Another idea - since I found the explanation on MDN Docs can be too technical sometimes (filled with jargons from the specs), I think beginners like me would find ChatGPT helpful.

Here are some screenshots comparing the two:

- MDN Docs: https://nitter.net/pic/orig/media%2FFsDOMrEaUAAy-Y5.jpg

- GPT-3.5: https://nitter.net/pic/orig/media%2FFsDPHbXagAA7Ky8.jpg

Since I use ChatGPT regularly, I decided to create my own client. I prefer to avoid third-party services that require privilege escalation like Grammarly and Copilot. I have developed distinct profiles for different tasks, each with its own system prompt and input method. After getting the hang of it, I plan to tweak the parameters as well. Here are some of the profiles:

Explainer: a default, general purpose Q&A. The prompt is "Explain to me like a 3rd grader. Skip prose." I plan to expand this profile to include additional communication styles, including step-by-step explanations, elaboration, and the Socratic method.

Proofreader: I use this profile to edit, simplify, and shorten any text (including this comment). I borrowed this feature from Grammarly Go, and it works by pasting the text and clicking a button.

Developer (in development): this uses a simple editor as input, with features similar to Cody/Copilot, such as adding types, naming things, summarizing, autocomplete, auditing, explaining, fixing, refactoring, and more.

Lastly, I plan to add two more profiles that are more creative and generative: Writer and Designer. They will act as private consultants/partners and assist me in brainstorming and complementing my skills in building websites.

I'm also building a personal ChatGPT client for a similar reason as the OP, which is to address the issues of buggy and slow UX, among others. As you mentioned, many people are currently working on projects using ChatGPT API. In fact, in the past 24 hours, around 12 new apps that have been showcased on OpenAI Discord channel alone. Some of these apps are open source, which makes them a great source of learning and inspiration for me.

After taking a quick look at their documentation page, I noticed that some of the buttons, especially the default secondary and a few of the outline buttons, seem to have a low contrast ratio when viewed in default light mode: https://daisyui.com/components/button/ Hopefully, developers won't use these components as is.

Although I'm not very familiar with Tailwind and its component library ecosystem, I found the DIY approach taken by https://github.com/shadcn/ui to be better suited to my needs. This approach offers greater customization and flexibility in designing UI components, which is where I find the most enjoyment in building UI. Of course, pre-built component libraries like OP can provide a quicker solution if resources are limited.

Over the past couple of years, I have come across numerous articles on CSS-Tricks that discuss other related technologies such as (semantic) HTML, SVG, Canvas, WebGL, UI libraries (e.g. Tailwind), and tools like Saas and PostCSS. So I think when starting a green-field project, it may be more appropriate to use a broader term like "style" or "look", than specifically using the keyword "CSS" (just an idea).

If the license at https://css-tricks.com/license/ is valid, anyone can scrape and rebuild a FOSS version of CSS-Tricks, ideally with a sustainable funding model to support its ongoing development. However, without an editor like Geoff, I am unsure whether it would maintain the same level of quality as CSS-Tricks.

I got 404 with OP link. I think it should be pointed to https://developer.mozilla.org/en-US/advertising?

Related PR: https://github.com/mdn/yari/pull/8213

Also, the ads has been added to EasyList: https://github.com/easylist/easylist/commit/f02f2264cdc4122c...

This resource explores each pattern in depth (excluding resumability):

https://www.patterns.dev/posts/rendering-patterns/

You can also check the illustration at the bottom of the page for a brief summary.

Context: https://twitter.com/bruno_simon/status/1620444960939212800

It looks like this release is mostly consists of bug fixes.

I am excited for upcoming features introduced in TP161:

• RegExp lookbehind

• OffscreenCanvas (2D)

• WASM SIMD on x64

• unprefixed Fullscreen API

• CSS Custom Properties (@property)

• CSS Typed OM

• more pseudo-classes work inside :has()

• :user-invalid & :user-valid

• Web Animations improvements

source 1: https://front-end.social/@jensimmons/109745211342131076

source 2: https://webkit.org/blog/13686/release-notes-for-safari-techn...

Here's a longer list compiled by Nikita: https://wiki.nikiv.dev/other/wiki-workflow#similar-wikis-i-l...

The website's theme and philosophy revolve around digital gardening. I am in the process of building one for myself, and I use this list as a source of inspiration: https://github.com/MaggieAppleton/digital-gardeners#digital-...

The website to get a Slack invite link (hntokyo.io) seems to be down.

[edit] The domain expired on Dec 9th.

Here's a temporary invite link in case anyone needs one: https://join.slack.com/t/hntokyo/shared_invite/zt-1me56squp-...

Let me share my recommended learning resources using Divio's model.

1. overview/explanation:

- https://web.dev/learn

- https://www.patterns.dev

2. (hands-on) tutorial:

- https://github.com/microsoft/Web-Dev-For-Beginners

- https://freecodecamp.org

- https://www.theodinproject.com (note: includes React)

- https://fullstackopen.com/en (note: includes React & GraphQL)

- online courses -- recommendation: CSS for JavaScript Developers and Three.js Journey

3. how-to guide:

- https://css-tricks.com

- developer blogs

4. reference:

- https://developer.mozilla.org

- https://javascript.info