Fullstack Autocomplete Search with Algolia
Вставка
- Опубліковано 15 вер 2024
- Build a fullstack 🔎 fulltext autocomplete search feature with Algolia and Firebase, with implementations covering Node.js, Svelte, and Angular. fireship.io/le...
- Algolia www.algolia.com/
#algolia #nodejs #firebase
Take the quiz 🤓
iOS itunes.apple.c...
Android play.google.co...
Upgrade to Fireship PRO at fireship.io/pro
Use code lORhwXd2 for 25% off your first payment.
♥️ Sometimes it feels like you exactly know what we want
I can feel it
I've used Algolia and I have to confess that it is more limited than what we think.
I'd prefer using elastic search.
U got it right
Community Members: Can you please add search to your website
Me: I don't have the time to do it
Fireship: It'll only take 12 minutes 13 seconds*
Me: On it!!!
Sometimes I feel like he is reading my mind
@@Llewellyn1411 Yup. All the time :)
That tip on how you can run functions locally with admin credentials being injected automatically is a great one. Thank you!
Excellent.
I hope you make a video for implementing Firestore full-text search in Flutter using Algolia
the addObject was not working for me (I was getting the Index.addObject is not a function from the Firestore functions log). I switched to saveObject and it works.
Mi comentario en español, este es uno de mis Canales favoritos, referencia inmediata a la hora de necesitar ideas gracias
Pricing is exactly why I use Elastic instead of Algolia. Otherwise, I'd actually prefer the latter.
Yeah I get that. I might do a self hosted elastic search video in the future.
@@Fireship Keep up the good work :)
Elasticsearch & Kibana running on docker is 🔥🔥
@@Fireship man, I'll really appreciate if you do that. I need it
This channel is awesome. I learned qlot about rxjs from this channel. Thanks.
I am thinking: won't it be cheap to just go with a simple node/mysql server if we want a full text search instead of cloud firestore? I mean if Algolia is going to do for me what we already did since forever, I seem to not understand the point of using cloud firestore and then linking it to Algolia. Please, I request you to correct me. It seems I am missing something really obvious here. Thanks in advance.
I remember using elastic search a long time back. Is this similar?
Yes, same type of service, but more developer friendly. I may do a video on a self hosted elastic search, which is cheaper if you tons of records.
That's what I thought or Endeca from Oracle for E-Commerce
@@Fireship Yes! Do it! At least so I know what exactly I'm paying for :D
@@Fireship Yes! Please doo.. This is exactly what I needed :D
Looking at Algolia pricing, this is just simply impractical for developers in developing countries..
You expose me to different sides of software development that I otherwise wouldn't get to see ♥️
thank you , easy and quickly explaintion.
Please do a typesense tutorial , typesense is open source and really really cheap.
For Flutter please!
As always great content! What's you opinion on Typesense?
Is there a valid reason for using the pre-built components in a real world production app? I've had some trouble customizing the view in my React app to look like a view I already had prototyped before using Algoliasearch
awsome, very usefull.
Thank you Rage :)
Great concise video
How to use this with express
Connect express and Aloglia private key. And send GET request to app.get(/search) in POSTMAN or INSOMNIA 👍
Firbase is fast and scalable, but it cheap? I doubt this. Btw thanks for the video.
hey there Jeff! how are you doing? i'm a big fan of your channel, it really helped me A LOT!!! but i really stuck on choosing the right ui framework for Angular. the only good ui framework i found was Ionic but it doesn't look as good as Material Angular. on the other hand Material Angular is sooo incomplete and unresponsive. there is a Nubelar Framework which looks really beautiful but still looks really incomplete. which framework do you suggest for my Angular project?
I'm getting a weird issue where my seed file is populating a different project :O (a client's project!) took me a while to figure that that was happening. Luckily no db damage or anything. Haven't figured out why - the functions deploy to the right project.
You could have used Nx for Fullstack(angular and nest)....
good one
could you an update with angular instant-search with Angular v17? pretty please
Noticed the await for keyup, would it perform well or would you have a different advice for real implantation using a timeout, or delays
Denouncing the event would be a good idea. This is more of a bare minimum example.
Wait ... What you said at 3:30 "change the firebase environment variables, without redeploy" how? All i know that every time i have to change anything in there i am required to redeploy the functions. So can you please help me understand what you are talking about and how we can change config without redeploy.
That means exactly what he said: by setting the app_id and the admin_key as environment variables, their values are loaded dynamically through the environment, as opposed to manually (re)hard coding them each time their values change
@@abdoufma everytime I call the firebase functions:config.set key=value CLI tell it clearly that it is required to redeploy the functions. So what i am missing here. I have tried that for a function to start using the new value, it must be redeployed as the .runtimeconfig.json is not updated until then in the deployed functions.
@@MindzGroupTech Not sure what to tell you man, it works fine for me, have ou tried updating to the latest version of the CLI tools?
I am confused. Isn't the firestore redundant in this example? You are duplicating all the data after all. Best, MZ
How do you come up with these brilliant ideas?
Another great video!!
Update* Algolia has updated their pricing tier
can I use algolia with firebase Spark plan?
Don't you need to enable billing to use functions
Wow. Amazing
Your not setting a debounce time on purpose because algoli knows how to handle a lot of requests or you just didnt mentioned it and it is a good practice to debounce?
On the svelte example it would be a good idea to debounce, but the Angular instantsearch example it should already be perf optimized.
Fireship great, thank you
@@Fireship I was following along the tutorial and noticed angular instantsearch makes a new request (operation) per every key stroke. It doesn't use debouncing at all
@@rusithgayashan3927 I believe that is the intended behavior. Instantsearch caches the results so it's not making a full round trip to the server on each stroke. If it's fast, everything is OK.
5:47 I cant see my functions on firebase, there is no chance to set up functions without payment?
If you use the Blaze plan, it's pay as you go, if you're just building a personal project unless you had an infinite loop that did like a million computations per day you'd be fine and most importantly free, but even then you can set up budget alerts
Love it
Went completely over my head but cool video I guess ..
firebase deploy dont work with me he return error in terminal i wont help
You made videos on Algolia previously. Is there any difference?
The backend code is basically the same, but the Frontend libraries have changed significantly, so felt like it was time to update.
@@Fireship Thank you so much for your clarification Jeff.
awesome!
Hi ,,, i tried using faker to write data to the firestore but everytime it fails ... please help me.. it gives an error saying
UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 60)
I tried using try catch and then got an error saying "no project id found in current environment"
Note: I did put the seed.js file inside functions directory
@@rupayanc I got something similar, see if this helps: firebase.google.com/docs/admin/setup#windows
Nice video :)
Yo.. u rock
Thank you!
Why is vue getting hated on? He even made a svelte app and not a vue one. 100% offended 😉
Please make a Typescript Longsleeve white, and i will buy it, not a hoodie person. Frat people love longsleeves not hoodies
wheres the Vue and React?