Solid + GraphQL = Realtime Magic

[@sgwong513]

Thanks for response to my comment with a video. As usual, really awesome video with great content. with just 33 minutes video but contains so many stuff of graphql.

[@jherr]

You're welcome! Thank you for the suggestion. It was really fun to build and to talk about. I hope it's useful for you.

[@sgwong513]

@@jherr Yeah, its really useful for me.

[@meemz3144]

man, your tutorials are such a joy to watch and so easy to understand. and all that for free!! Thank you very much!

[@eminqasimov3398]

background view of your videos Jack is amazing, I am relaxing , your introduces a lot of stuff about new and innovative technoligies - webpack module federations, Valtio, solid ... etc. 🚀🚀

[@DaniloMongelli]

Jack in 1/2y u will be one of the biggest dev chan in the freakin world, awesome videos.

[@jherr]

Givin' it my all. :)

[@yasin_osman]

both graphql and solidjs were the top new blazing techs that ive been wanting to look into, thx

[@uprobo4670]

new? they are 7 years and 4 years respectively .........

[@uprobo4670]

maybe at erdogan's they are new hahaha

[@yasin_osman]

@@uprobo4670 what part of my comment did you not understand and what does it have to do with erdogan lol :D I meant that they are newly added to the group of techs that I’ve been wanting to look into.

[@uquantum]

Thank you for a very helpful code-along and for using Urql+Solid which have smaller footprints than Apollo+React

[@HP_Tubcraft]

some content with react / typescript with graphql and apollo would be great, maybe a simple CRUD app with postgres.. that would be killer! keep up the great work

[@ajcoder2795]

That's Easy Peasy now, Nice work Mr.Jack 😎✌🏻

[@zemariagp]

I follow a bunch of FE gurus and you are the absolute best

[@ToddDunning]

Yeah I gave up on Traversy after seeing Jack

[@dars1816]

Thank you for this. Am currently planning to build a digital newsroom system with React, but SolidJS is worth the try.

[@jherr]

Digital newsroom sounds intriguing. What does that entail?

[@dars1816]

@@jherr It's basically a CMS but it has its own in-house apps such as Todos, Planners, Collaborative Article Production with ProseMirror for both Print and Digital publications, etc. I still have to test how Firestore Database performs on SolidJS though.

[@jherr]

@@dars1816 Having done a ton of Firestore work over the past couple of months I'm sure will do just fine with it. Been thinking about doing a supabase video. It's similar from what I hear.

[@saideepesh6036]

Hope to see video or video series on how to ace frontend interviews or related stuff, thanks for the content

[@deamorta6117]

Thank you for using URQL!

[@miklosnemeth8566]

3:29 You love exclamation marked type definitions :-D 4:34 I still remember the excitement when I first executed SELECT id, done, text FROM Todos 30 years ago.

[@TruSktr]

It'd be sweet to see this using solid-urql!

[@dnyaneshpatil2480]

Thank you for awesome content sir 🙏

[@СергейКозлов-н1л]

Jack, you are amazing. Hello from Russia!)

[@malekitani3136]

this is awesome, keep it up

[@oumardicko5593]

would be great to see a react + hooks + rxjs vide :) Love the content

May you do a Solid.js + URQL with JWT based authentication video? Much appreciate!

[@ToddDunning]

Somebody tell me if just writing a whole bunch of api combinations is preferable to having to add the GraphQL step…????

[@jamievaughn9845]

the npm package 'subscriptions-transport-ws' was deprecated shortly after this video was published, any chance for an update using the recommended replacement package 'graphql-ws'?

[@ShanyGolan]

co-pilot magic there

[@matkra5254]

Wow, that transition! :D

[@alexc.9921]

Why graphql-yoga over apollo-server? Great work as always, Jack! Keep rocking 😄

[@jherr]

Yeah, that was an interesting call. Next time I'll use either Apollo Server or Prisma to change it up. In this case I wanted something really easy. And I figured that the point of the video was more about getting any GraphQL server talking to the Solid-JS client, so I'm _hoping_ that folks will just look at this and say; "Oh, cool, I can just swap out the GQL server for my service, or an Apollo server, and go for that." I have definitely noticed that graphql-yoga seems to be dying.

[@justfly1984]

Hope to see how you make solidjs with canvas!

[@jherr]

Oooo... Alexey, that's a cool idea.

[@slavmin]

Awesome stuff!

[@JohnDoe-sz5jh]

Id love to see one on the security notifixation in the console when you fire up a local server. About "Unlimited file system access...".

[@ouss]

Can you do a tutorial for Hasura as it is becoming to norm of backends(in fact backendless) couple with nextjs?

[@technikhil314]

@@internet4543 Do they offer self host version too. I took a look at their docs doesnt seem like they do offer that.

[@technikhil314]

@@internet4543 yup they have two streams opensource and cloud. There is path to move from opensource to cloud. I find it good as I can leverage aws free tier or heroku for my non prod environments. It really matters when it comes to cost saving for early stage startup.

[@Norfeldt]

👏👏👏👏

[@gabrielmalek7575]

Couldn't get ws to work, tried with GraphQL-ws but didnt' work either, gonna switch out the server with apollo, and try again.

[@Gsiniguez]

Plz can u do an offline first application with grpahql and urql or apolo?

[@jherr]

Hmmm, interesting.

[@Balance-8]

Can you do a tour of your VSCODE theme set up + your terminal auto complete + terminal theme?

[@jherr]

I get asked about it a lot, I really should make a video on it.

[@Emka877]

Steve URQL There you go

[@kojche]

Great tutos, I love it! :) One question: What tech stack would you use, if you need to build full-stack e-commerce website? Thank you in advance! :)

[@jherr]

NextJS on top of some eCommerce engine. Saleor looks good and is OSS.

[@kojche]

@@jherr Great, thanks a lot! 🤗

[@lucasgiunta8874]

Can you use GraphQL server like that with a metaframwork like SvelteKit or Astro in a different port to have this interfaces to test your server ?

[@mortezatourani7772]

Awesome

[@kaviisuri9997]

Would love your thoughts on server actions and your thoughts on how it'll change the coupling of frontend and backend, and when it makes to use them vs making a rest or gql api I'm might be very off here but it seems like server actions will lead to more work, when it comes to developing for multiple platforms (mobile, desktop, etc)

[@jherr]

I think they are good for augmenting the app with simpler BFFs. For example, if you need a simple search API on your data set just to drive a table component, then an action might be a good use case.

[@rajan-u6b]

I just started learning full stack development using javascript, wanted to be as cool as you, any tips for a newbie or some kind of road map( full stack) will be appreciated. Btw, thanku so much for your videos.

[@jherr]

Sounds like a good idea for a video.

[@rajan-u6b]

@@jherr 🤩

[@bigmistqke]

Anybody could point me to these optimizations u could do instead of sending the whole state over and over with each update?

[@jherr]

Not sure I understand. The point of SolidJS is to do fine grained updates, so when the data is updated only the specific DOM tags that need updating are updated.

[@bigmistqke]

@@jherr mm so when the data is changed to the server, you sent the whole array to the client. You mention optimization-techniques that could be used so that we do not have to pass the complete array over the wire with every update.

[@bigmistqke]

@@jherr i m building a node-editor with some complex state driving the whole shebang. Right now the app is all client-side, with solid btw absolutely loving it, but I am looking to turn it into a realtime collaborative tool.

[@jherr]

Gotcha. You can send whatever you want for the subscription. So that could be just the most recent message and then it would be up to the client keep it in sync.

[@wahoobeans]

Teacher Jack, question. Does subscriptions still work at scale? What if there are two server pods?

[@MG-nn8dy]

So todos[] would continue to be preserved as long as the server is running?

[@kefiltonouewa]

Which them are you using on VScode?

[@jherr]

Night Wolf [dark] with Operator Mono.

[@kefiltonouewa]

@@jherr Thank you very much! Your content is very much appreciated. Got to keep that solid.js going!!

[@omarshref4803]

i love u very very muchhhhhhhhhhhh

[@prashantm9856]

What theme are u using 😅

[@jherr]

Night Wolf [black]

[@millennialbusinessventures7412]

What camera do you use for these videos?

[@shivaa3ps177]

Hmm... Why do you say "Blue Collar Coder"?

[@jherr]

It's the brand name of the channel. It's indicative of my underlying philosophy of customer-centric practical coding.

[@Torsten4385]

Why was my comment deleted? I've just pointed out, that apollo is not bound to react.

[@timhilt1185]

There are apollo clients for React, Android and iOS. Because Jack isn't developing for Android or iOS, he would have to use the React client, which is bound to... React. Can't tell you why the comment was deleted though.

[@Torsten4385]

@@timhilt1185 Apollo Client has an optional peer Dependency to react. You can use it without react by importing "@apollo/client/core" instead of "@apollo/client". I already tried to build an apollo client for solid (npm "@merged/solid-apollo") that works quite well.

[@jherr]

I didn't delete any comments. :( I only delete the spam ones (and that would not have been spam.) I looked into Apollo and I recall seeing a page saying that it hard bound to React but there were ports. I'm happy to be wrong though.

[@Torsten4385]

@@jherr seems like every comment that includes a link gets automatically deleted. Is that some configuration that you may change from your end? I think links for some documentations or so could be of value.

[@jherr]

@@Torsten4385 Huh. I have that feature disabled, and have, for... ever, from what I can see. I definitely get spammy links and have to manually delete them. Normally when a video launches a bunch of bots jump on and ad some links. And I've had folks leave links before... I'm gonna make you an approved commenter and then it should work fine for you. Thank you for pointing out that Apollo is not bound to react. I'll check that out the next time I do a GraphQL video that's not on React.

[@TruSktr]

What do you use for your magic autocomplete?

[@jherr]

*GitHub Copilot* is the magic there.

[@technikhil314]

Which keyboard do you use? Sounds too soft.

[@jherr]

It's a Varmilo with MX Cherry Reds. I'm still getting used to it. It was a birthday gift from my daughter who is a gamer and big time into mechanical keyboards.

[@technikhil314]

@@jherr Nice one. Thanks for sharing the story. Belated happy birthday to you.

[@jherr]

@@technikhil314 Thanks! It was a good one. She also got me Resident Evil Village and we had a lot of fun playing that.

[@ae_holic]

Star Wars fan spotted

[@DejayClayton]

Apollo is not strictly bound to React, and it never has been.

[@MG-nn8dy]

🤯😴😴😴🧐🤯🤯🤯

[@sede189]

Fantastic video!