- 32
- 504 021
RavenJS
Canada
Registrace 7. 10. 2016
Videos about technology, computing and logic. Topics include Linux Tutorials, Python Tutorials and JavaScript Web Development tutorials.
I'm a:
1. Linux sysadmin
2. JavaScript Web Developer
3. Python programmer
4. Software developer
LOGICISM ON THE WEB:
📽️ LBRY: odysee.com/$/invite/@Logicism:b
📁 GitHub: github.com/Logicism81
📁 GitLab: gitlab.com/logicism
I'm a:
1. Linux sysadmin
2. JavaScript Web Developer
3. Python programmer
4. Software developer
LOGICISM ON THE WEB:
📽️ LBRY: odysee.com/$/invite/@Logicism:b
📁 GitHub: github.com/Logicism81
📁 GitLab: gitlab.com/logicism
Need performance in React? useRef ✅ | useState ❌
In this video, we'll discuss when to use useState vs useRef. I'll also demonstrate how to handle events in React, and use 3rd party Javascript libraries in React using useRef.
Finished code:
- Coming Soon (comment if it's urgent)
Timestamps:
0:00 Introduction
0:24 Problem Statement
1:15 useState
5:38 useRef
8:33 Mouse Events
10:45 3rd party libraries
Finished code:
- Coming Soon (comment if it's urgent)
Timestamps:
0:00 Introduction
0:24 Problem Statement
1:15 useState
5:38 useRef
8:33 Mouse Events
10:45 3rd party libraries
zhlédnutí: 689
Video
Basic CRUD App using HTMX and Flask - Learn HTMX and Flask in 1 hour!
zhlédnutí 6KPřed 7 měsíci
No prerequisite knowledge required! In this video, we'll build a simple CRUD app using HTMX and Flask from scratch. Finished code: github.com/voidranjer/htmx-flask-crudapp Timestamps: 0:00 Introduction 4:12 Installing Flask 7:32 Templates 8:40 Macros 12:41 Making the Navbar 16:45 Extending Templates 21:56 `url_for` function 26:00 Database 29:48 Passing data into templates 30:53 For loops 33:14 ...
Protected Routes and Redirect on Login with NextJS 13 + Firebase Auth
zhlédnutí 6KPřed 8 měsíci
Learn how to leverage the App Router feature in Next.js 13 to create routes that are protected and accessible only to authenticated users. 💡 Key Topics Covered: 1. Setting up Firebase Authentication with Next.js 13. 2. Creating Protected Routes with the App Router. 3. Implementing Redirect on Login for a seamless user experience. 4. Use URL Query Parameters [/login?continueTo=] to redirect user...
The proper way to do GLOBAL STATE in React - Jotai, Boiletplate-free Redux
zhlédnutí 5KPřed rokem
Global State Variables in React without Redux or boilerplate. Jotai takes an atomic approach to global React state management inspired by Recoil. PocketBase Crash Course Playlist: czcams.com/play/PLqFvlDFoiZ-0ixIS8D4JTHRuVy_rkfROY.html Jotai Docs: jotai.org/ Hostinger Promo Code: RAVENJS hostinger.com/ravenjs (use code RAVENJS for 10% off all products/plans)
PocketBase Tutorial #6 - Automatic Refetching with the useQuery hook (react-query)
zhlédnutí 4,2KPřed rokem
How to build a full-stack React App with PocketBase. PocketBase Crash Course Playlist: czcams.com/play/PLqFvlDFoiZ-0ixIS8D4JTHRuVy_rkfROY.html PocketBase Docs: pocketbase.io/docs Hostinger Promo Code: RAVENJS hostinger.com/ravenjs (use code RAVENJS for 10% off all products/plans)
PocketBase Tutorial #5 - Sending Verification Emails (with Sendinblue SMTP)
zhlédnutí 6KPřed rokem
How to build a full-stack React App with PocketBase. PocketBase Crash Course Playlist: czcams.com/play/PLqFvlDFoiZ-0ixIS8D4JTHRuVy_rkfROY.html PocketBase Docs: pocketbase.io/docs Hostinger Promo Code: RAVENJS hostinger.com/ravenjs (use code RAVENJS for 10% off all products/plans)
PocketBase Tutorial #4 - Auth Hooks (with react-query)
zhlédnutí 7KPřed rokem
How to build a full-stack React App with PocketBase. PocketBase Crash Course Playlist: czcams.com/play/PLqFvlDFoiZ-0ixIS8D4JTHRuVy_rkfROY.html PocketBase Docs: pocketbase.io/docs Hostinger Promo Code: RAVENJS hostinger.com/ravenjs (use code RAVENJS for 10% off all products/plans)
PocketBase Tutorial #3 - Authentication (with react-hook-form)
zhlédnutí 14KPřed rokem
How to build a full-stack React App with PocketBase. PocketBase Crash Course Playlist: czcams.com/play/PLqFvlDFoiZ-0ixIS8D4JTHRuVy_rkfROY.html PocketBase Docs: pocketbase.io/docs Hostinger Promo Code: RAVENJS hostinger.com/ravenjs (use code RAVENJS for 10% off all products/plans)
PocketBase Tutorial #2 - React & PocketBase SDK Setup
zhlédnutí 12KPřed rokem
How to build a full-stack React App with PocketBase. PocketBase Crash Course Playlist: czcams.com/play/PLqFvlDFoiZ-0ixIS8D4JTHRuVy_rkfROY.html PocketBase Docs: pocketbase.io/docs Hostinger Promo Code: RAVENJS hostinger.com/ravenjs (use code RAVENJS for 10% off all products/plans)
PocketBase Tutorial #1 - Intro to PocketBase
zhlédnutí 24KPřed rokem
How to build a full-stack React App with PocketBase. PocketBase Crash Course Playlist: czcams.com/play/PLqFvlDFoiZ-0ixIS8D4JTHRuVy_rkfROY.html PocketBase Docs: pocketbase.io/docs Hostinger Promo Code: RAVENJS hostinger.com/ravenjs (use code RAVENJS for 10% off all products/plans)
Build and Deploy a Full Stack Social Media App (ReactJS + Firebase v9 + Chakra UI)
zhlédnutí 22KPřed rokem
Deploy your websites or project NOW for $1.99/month: hostinger.com/ravenjs (get extra 10% off with code RAVENJS at checkout) Build and deploy a React full stack social media app from scratch with Firebase Hooks, React Hook Form, and React Router. The code used in this video (with the .htaccess snippet): github.com/LogicismX/social-media-app Firebase Auth Playlist: czcams.com/play/PLqFvlDFoiZ-3H...
Subcollections in Firebase/Firestore v9 (with React.js)
zhlédnutí 20KPřed 2 lety
Learn how to create and access subcollections in Cloud Firestore. React Firebase v9 The code used in this video: github.com/LogicismX/firebase-subcollections Cloud Firestore Playlist: czcams.com/play/PLqFvlDFoiZ-2SAX7YXCYtb28K4IooCIlS.html Firebase Auth Playlist: czcams.com/play/PLqFvlDFoiZ-3HoHuYfqc4SrId1JbrtTnA.html Supabase Playlist: czcams.com/play/PLqFvlDFoiZ-3c2rkeQDhKXn7h27TDlQL7.html Cl...
Supabase React Tutorial - Building a Full Stack Todo App with Supabase and ReactJS (with realtime)
zhlédnutí 12KPřed 2 lety
Learn how to build a full stack React App with Supabase. Live Demo: todo.yapsh.com The code used in this video: github.com/LogicismX/supabase-todo Supabase Playlist: czcams.com/play/PLqFvlDFoiZ-3c2rkeQDhKXn7h27TDlQL7.html Firebase Auth Playlist: czcams.com/play/PLqFvlDFoiZ-3HoHuYfqc4SrId1JbrtTnA.html Cloud Firestore Playlist: czcams.com/play/PLqFvlDFoiZ-2SAX7YXCYtb28K4IooCIlS.html Supabase Docu...
Full Stack React Chat App Tutorial (Firebase v9 + ChakraUI + NextJS)
zhlédnutí 17KPřed 2 lety
Build a chat app from scratch with ReactJS. Live Demo: chat.yapsh.com The code used in this video: github.com/LogicismX/fullstack-chatapp Firebase Auth Playlist: czcams.com/play/PLqFvlDFoiZ-3HoHuYfqc4SrId1JbrtTnA.html Cloud Firestore Playlist: czcams.com/play/PLqFvlDFoiZ-2SAX7YXCYtb28K4IooCIlS.html Flexbox CSS Guide: css-tricks.com/snippets/css/a-guide-to-flexbox/ Timestamps: 0:00 Introduction ...
User Profile Pictures with React Authentication and Cloud Storage (with Firebase v9)
zhlédnutí 34KPřed 2 lety
Upload user profile pictures to Firebase Cloud Storage. Link Authentication with Cloud Storage with Firebase Web v9 Modular. The code used in this video: github.com/LogicismX/React-Firebase-Auth/tree/Part-2 Firebase Auth Documentation: firebase.google.com/docs/auth/web/start Firebase Auth Playlist: czcams.com/play/PLqFvlDFoiZ-3HoHuYfqc4SrId1JbrtTnA.html Timestamps:
React Authentication Crash Course (with Firebase v9)
zhlédnutí 44KPřed 2 lety
React Authentication Crash Course (with Firebase v9)
How to set up React with Firebase/Firestore v9 (Part 5 | Order documents by timestamp)
zhlédnutí 10KPřed 2 lety
How to set up React with Firebase/Firestore v9 (Part 5 | Order documents by timestamp)
How to set up React with Firebase/Firestore v9 (Part 4 | Query delete multiple documents)
zhlédnutí 8KPřed 2 lety
How to set up React with Firebase/Firestore v9 (Part 4 | Query delete multiple documents)
How to set up React with Firebase/Firestore v9 (Part 3 | setDoc)
zhlédnutí 11KPřed 2 lety
How to set up React with Firebase/Firestore v9 (Part 3 | setDoc)
How to set up React with Firebase/Firestore v9 (Part 2 | addDoc)
zhlédnutí 20KPřed 2 lety
How to set up React with Firebase/Firestore v9 (Part 2 | addDoc)
How to set up React with Firebase/Firestore v9 (Part 1 | onSnapshot)
zhlédnutí 56KPřed 2 lety
How to set up React with Firebase/Firestore v9 (Part 1 | onSnapshot)
Dividers & Spacing - Ant Design Tutorial || #4
zhlédnutí 3,1KPřed 3 lety
Dividers & Spacing - Ant Design Tutorial || #4
Typography & Text - Ant Design Tutorial || #3
zhlédnutí 3,2KPřed 3 lety
Typography & Text - Ant Design Tutorial || #3
Buttons & Icons - Ant Design Tutorial || #2
zhlédnutí 4,1KPřed 3 lety
Buttons & Icons - Ant Design Tutorial || #2
Intro & Setup - Ant Design Tutorial || #1
zhlédnutí 7KPřed 3 lety
Intro & Setup - Ant Design Tutorial || #1
Input date and time in HTML and Javascript || (flatpickr.js)
zhlédnutí 104KPřed 3 lety
Input date and time in HTML and Javascript || (flatpickr.js)
Automatic deployment from GitHub to server via SFTP (GitHub Actions)
zhlédnutí 15KPřed 3 lety
Automatic deployment from GitHub to server via SFTP (GitHub Actions)
How to host websites for free with GitHub Pages
zhlédnutí 265Před 3 lety
How to host websites for free with GitHub Pages
4 ways to kill Linux processes - kill, killall, pkill, xkill
zhlédnutí 4,8KPřed 3 lety
4 ways to kill Linux processes - kill, killall, pkill, xkill
I am glad I found your channel, that was awesome! Does useEffect not have the same performance issues as useState?
Hope Raven is OK he hasn't made a commit since December 2023
Thanks for this tutorial it was really really helpful
Proved to be useful. Thanks!
I don't even know where to start to thank you. You have just unstuck me from the problem I was trying to fix for the past weeks without receiving any help. You have just allowed me to pass my final exam I've been struggling on so much, and finish my studies. You have just allowed me to get my diploma and start looking for a job. I will never be able to thank you enough. Crazy how people accross the world can literally change your life. Thank you for explaning so well, taking the time and walking us through this. Thank you!
SMTP2GO is another good option for smtp server. 1,000 emails per month for free and then very reasonable pricing beyond that.
Thank you brother. Exactly what I needed
My guy. You are meant to teach Respect 100 Looking forward to advanced flask htmx series Or fastapi htmx series
thanks a lot i got help from your tutorial
Simple, quick, working: only 1 out of 100 youtube tutorials are like this! Thanks!!!
16:15 the webpage shows "404 Not found" when I go to "/posts". Any idea...? Seems like the folder's name become a part of url on his instruction but not on my codes. Is it because I am using windows computer..?
very clear!
Great video, thank you. After finishing this tutorial, everything works fine. However, I noticed that you forgot something: when clicking on the comment icon and navigating to the post's comments, if you delete the post on that page, it becomes blank because the page depends on the post ID, which has been deleted. Do you have any solutions for this issue?
Is it responsive for Al screen?
Bro, your explanations are really awesome, its a shame you stopped 😢
There are great, man, what a public service.
To make the consol logs bigger (on brave at the least), open the dev-tools and then zoom using ctrl+ :) Also, awesome tutorial :D
спасибо брат, помог
react-supabase is not working. That's the issue with adding all kinds of dependencies to make it easy. They stop maintaining it and your updated code won't work.
i read article about 7 top react state management. and jotai is easy to learn.
Thank you so much for save my time. I have been searching this for complete an assignment.
the whole thing is in client component? 🙄 We'll appreciate so much more if we can get a server component technique. Thta's the point of app router
תודה רבה, הסבר מועיל מאוד ❤️👍
Thanks for the review! Everything is very well explained. But I still have one question: what is the difference between Jotai and Zustand, and also in which case should one or the other be used?
i think you forgot to put the post validation
whoever encounters error "Uncaught (in promise) FirebaseError: Missing or insufficient permissions." 1. go to rules in Cloud Firestore 2. in "allow read, write: false" , replace it to allow read, write: if request.auth != null;
Can you make the demo for password reset as well
Right on mate - you're like the only React + Pocketbase tutorial out there! Much love, thanks.
Thank you sir
First 50 mins - very good presented and logically sound tutorial. Last 30 mins tutorial feels rushed and become hard to follow. Ganbatte Kudasai!
Error with DB import: File "/home/**/flasky/server.py", line 2, in <module> from .db import sample_db ImportError: attempted relative import with no known parent package
Solution: import sys sys.path.append("/home/**/flasky/") from db import sample_db
@@alexandrgidrevich986Thank You so much for this ! I ran into the same issue... your solution worked😊
Also for anyone using windows, point sys.path to the root folder where db is saved for example db was in folder crud-htmx-flask, so import sys sys.path.append("C:\crud-htmx-flask") from db import sample_db
You are a game changer!
you look like you've got impeccable taste in anime
This helped me even after 2 years of uploading. Great work, you guys are real heros
The best tutorial i've seen using flask + htmx. Thank you
amazing, thanks a lot for lessons
Thank you for the videos about Pocketbase. Can you also make a video about self hosting on a static server please. And also highlight security aspects. Thank you so much.
I have a problem when I navigate through different pages, the profileImageSrc state gets set to the default picture for a little bit till the actual one gets loaded, it's feeling weird how can I fix it
Simple and straight to point, Thanks 👍
Great tutorial, really appreciate it. Was able to learn how to build an online marketplace app for a cohort project, which helped me just land my first CS job at a local startup making a mobile marketplace app. Much thanks and wish you all the best!!
Been struggling with this. You explained it so well. Thanks!
Great explanation, really helped me take on new projects!
A nice "toy" DBMS for learning/prototyping ... but not for production. Thx for these tutorials.
Fantastic video. This video helped a really big project I am working on. I appreciate it
Thanks a lot man, it was really helpful❤
Tks James! Was a nice project. What you think about Svelte and HTMX? I was studying and in love with Svelte but now I saw a lot of people talking about HTMX. I am not sure if study HTMX now for some nice basic website solutions. I am a Golang Backend Developer. Cheers.
this is my first time learning firebase, you explained everything very well, thank you so much!
Your tutorial got me 95% there. The only reason for the missing 5% is time. I had to update checkout version and will have to create encryption key pair without a password as the sftp code cannot handle key and pass together. Thank you!
Such a useful video. Thank you! But it ends so anti-climactic... :)
I appreciate your knowledge friend. After watching three videos in this playlist I learned valuable things about Pocketbase SDK. However, Can you please stop going tooo fast. We're humans and some of us has some delay to process information. I wanted to learn how to implement PocketBase in the backend of my WebService mini-project but found myself in tutorial hell. So please take your time making future videos and pleeease elaborate. Thank you