- 81
- 470 862
Kati Frantz
เข้าร่วมเมื่อ 28 พ.ย. 2016
When I started my journey as a software engineer, I didn't know what to learn, where to learn or how to learn. This delayed my career for many years, and it was very difficult working for companies.
After many years of struggles, mentoring hundreds of developers, consulting for multiple companies and teaching over 60 thousand students, I decided to create this channel to boost your career in software engineering.
My mission and vision is to positively impact your career, moving you from beginner, intermediate or advanced developers to the next level in your career.
Sounds like something you're interested in? Awesome! Tweet at me with ideas of things you want to learn.
After many years of struggles, mentoring hundreds of developers, consulting for multiple companies and teaching over 60 thousand students, I decided to create this channel to boost your career in software engineering.
My mission and vision is to positively impact your career, moving you from beginner, intermediate or advanced developers to the next level in your career.
Sounds like something you're interested in? Awesome! Tweet at me with ideas of things you want to learn.
How to effectively test your Next.js applications with Jest
Free React.js testing masterclass: testingreact.katifrantz.com
I've had the chance to build and ship multiple next.js applications to production over the past few years, and testing these applications is an essential part of writing quality software. In this video I will teach you two simple essential parts of testing your next.js applications to make your applications more resilient to bugs.
📚 Materials/References:
Source code: github.com/tenseijs/tutorials/commit/e99738b5df6dab99e54ff211d833742f962c2c19
🌎 Find Me Here:
My site: katifrantz.com
My courses: katifrantz.com/courses
Twitter: bahdcoder
Github: github.com/bahdcoder
⏱️ Timestamps:
I've had the chance to build and ship multiple next.js applications to production over the past few years, and testing these applications is an essential part of writing quality software. In this video I will teach you two simple essential parts of testing your next.js applications to make your applications more resilient to bugs.
📚 Materials/References:
Source code: github.com/tenseijs/tutorials/commit/e99738b5df6dab99e54ff211d833742f962c2c19
🌎 Find Me Here:
My site: katifrantz.com
My courses: katifrantz.com/courses
Twitter: bahdcoder
Github: github.com/bahdcoder
⏱️ Timestamps:
มุมมอง: 14 773
วีดีโอ
The Ultimate React Crash Course - Become a pro of the latest React
มุมมอง 1.8K3 ปีที่แล้ว
In this video we are going to cover the fundamentals of the React framework. We will dig deep into core concepts that are required to becoming a pro react developer: components, props, state, JSX, babel and so much more. Questions? Please comment below or reach out to me on Twitter bahdcoder Please subscribe to my newsletter for much more content on becoming a professional React dev...
Build fast and scalable forms with React and React Hooks
มุมมอง 8213 ปีที่แล้ว
In this video, I'll show you how to build fast, scalable, easy and reliable forms in React using Hooks. We'll build a real-world example of a login form, with validation rules, loading and submit states, with everything you'll need to add forms to your own applications. Got any questions? Please comment below and I'll be glad to respond.
Getting started with Tensei.js headless CMS: Build and deploy a simple forum backend in 10 minutes
มุมมอง 1.7K3 ปีที่แล้ว
In this video, we are going to introduce the best node.js headless CMS, Tensei js. We are going to build a basic API and administration panel for a simple forum application. Tensei ships with GraphQL, authentication, CMS out of the box. In this tutorial we will also ship this API seamlessly and easily to Heroku. Come along and let's have some fun. Here's a link to the Tensei repository github.c...
3/ Database design dbdiagram.io: Build a complete user feedback SAAS (As a software engineer)
มุมมอง 4.7K3 ปีที่แล้ว
In this video, we are going to design a database schema for a complete SAAS application from scratch. We will be using a tool called dbdiagram.io to plan our database tables, columns and relations. This is part of our askusers.io series, where we build a fullstack SAAS project from start to finish.
2/ Choosing the right tech stack: Build a complete user feedback SAAS (As a software engineer)
มุมมอง 2.2K3 ปีที่แล้ว
In this video, I am going to teach you how to choose the technologies for a project. Most businesses need a marketing website, a database, a customer portal. How do you choose which technologies to use? We'll be going over the requirements for the askusers.io project, and we'll choose which is the best to use for a marketing website, for the customer portal and for the database.
1/ Product research & domain purchase: Build a complete user feedback SAAS (As a software engineer)
มุมมอง 1.4K3 ปีที่แล้ว
In this video I'm going to show you how to build a complete user feedback SAAS application from scratch as a software engineer. We'll start with market research, a really important skill required to build products people love. Next, we'll go to purchasing a domain on hover.com. You are going to love this. I'll be sharing tons and tons of tips in this video about my many years building products ...
Tensei: The Ultimate guide to JWT client side authentication (Stop Using Local Storage !!!)
มุมมอง 115K4 ปีที่แล้ว
The most common practice in the industry today is to save JWT in local storage or cookies. This is not secure, and there's a much better way to do this. In this video I will show you all about it using the Tensei JS framework as our backend provider. Read the blog post for this video: katifrantz.com/the-ultimate-guide-to-jwt-client-side-authentication-stop-using-local-storage Code repository: g...
lesson 2 how the home view is displayed
มุมมอง 4006 ปีที่แล้ว
Discussion Forum and Questions: www.bahdcasts.com/course/adonis-4-from-scratch-to-saas
lesson 9 completing the cycle model view controller
มุมมอง 1296 ปีที่แล้ว
lesson 9 completing the cycle model view controller
lesson 5 controller and view communication
มุมมอง 1486 ปีที่แล้ว
lesson 5 controller and view communication
lesson 10 creating database records with lucid
มุมมอง 1446 ปีที่แล้ว
lesson 10 creating database records with lucid
lesson 1 installing adonis
มุมมอง 1.1K6 ปีที่แล้ว
The Source Code: github.com/bahdcasts/adonis-js-from-scratch/tree/lesson-1-installing-adonis Discussion Forum and Questions: www.bahdcasts.com/course/adonis-4-from-scratch-to-saas
lesson 4 refactoring to controller files
มุมมอง 1636 ปีที่แล้ว
lesson 4 refactoring to controller files
*** The Completely Free Ultimate Laravel Mastery Udemy Course 100% off ***
มุมมอง 7K7 ปีที่แล้ว
The Completely Free Ultimate Laravel Mastery Udemy Course 100% off
Social network in Laravel 5.3 and Vuejs 2.0 #58 formatting search results in a better way
มุมมอง 10K8 ปีที่แล้ว
Social network in Laravel 5.3 and Vuejs 2.0 #58 formatting search results in a better way
Social network in Laravel 5.3 and Vuejs 2.0 #57 displaying search results using vuejs
มุมมอง 2.5K8 ปีที่แล้ว
Social network in Laravel 5.3 and Vuejs 2.0 #57 displaying search results using vuejs
Social network in Laravel 5.3 and Vuejs 2.0 #56 Realtime searching with vuejs and algolia
มุมมอง 2.1K8 ปีที่แล้ว
Social network in Laravel 5.3 and Vuejs 2.0 #56 Realtime searching with vuejs and algolia
Social network in Laravel 5.3 and Vuejs 2.0 #55 Algolia and vuejs working together
มุมมอง 3.2K8 ปีที่แล้ว
Social network in Laravel 5.3 and Vuejs 2.0 #55 Algolia and vuejs working together
Social network in Laravel 5.3 and Vuejs 2.0 #54 installation of Laravel scout and algolia driver
มุมมอง 2.5K8 ปีที่แล้ว
Social network in Laravel 5.3 and Vuejs 2.0 #54 installation of Laravel scout and algolia driver
Social network in Laravel 5.3 and Vuejs 2.0 #53 Creating user's table seeder
มุมมอง 1.2K8 ปีที่แล้ว
Social network in Laravel 5.3 and Vuejs 2.0 #53 Creating user's table seeder
Social network in Laravel 5.3 and Vuejs 2.0 #52 Sorting an array with PHP's USORT function
มุมมอง 1.3K8 ปีที่แล้ว
Social network in Laravel 5.3 and Vuejs 2.0 #52 Sorting an array with PHP's USORT function
Social network in Laravel 5.3 and Vuejs 2.0 #51 creating the unlikes method
มุมมอง 1.2K8 ปีที่แล้ว
Social network in Laravel 5.3 and Vuejs 2.0 #51 creating the unlikes method
Social network in Laravel 5.3 and Vuejs 2.0 #50 Creating the likes method
มุมมอง 1.6K8 ปีที่แล้ว
Social network in Laravel 5.3 and Vuejs 2.0 #50 Creating the likes method
thank you very much i have learnt alot
but you are storing refresh token in cookies so it is not in-memory
damn me if i understood
can any one answer why cookies are getting clear when refresh the page ?
Hello Coach, Hope this message finds you well. I'm reaching out to you today because I believe your courses have the potential to attract a significant number of students and generate positive reviews. Would you be interested in proceeding further? Here are my marketing plan to promote your Udemy course to attract more students and gain many positive 5 stars reviews: 1. Offering free Coupon: Provide a taste of your course content with a free coupon to enroll 1000 students in 5 days. 2. Utilizing Social Media 3. Email Marketing Campaign 4. And possibly running ads. I'm looking forward to hearing from you soon. Thanks.
But doesnvt the refresh token have the same problem as the cookie? Can't an attacker just make a request with the refresh token and get the jwt that way?
Great Video. Thanks alot. I gave a question. Why not just store the JWT token inside the HTTP only cookie since XSS attacks can't get to it. Instead of the hassle of using a refresh token. Thank you.
I searched a lot about these refresh token and access token, finally, I understood what's going on. Thank you sir
This was/is a phenomenal video. Though not titled microservices, this is the only video that I've found that helped me with the front end side of handling APIs. Thank you for making this.
the fact that your previous app got hacked through XSS has absolutely nothing to do with the JWT being in localStorage as a sole fact. So it's absolutely deceptive to advertise to "Stop using local storage". So many people get their facts wrong, end up getting to the wrong conclusion, and spread it out anyway... LocalStorage, in memory using closure or session, should all be considered vulnerable to XSS. With that in mind you should: 1. make expiration time small (15-30mins) 2. make sure the jwt is unusable outside of the user's browser by using a fingerprint (in short, random string that you hash, include to the JWT payload, and set the cleartext as an httpOnly, secure, sameSite strict cookie) to verify all requests (if token's fingerprintHash !== hash(cleartextFingerprint), smthg's wrong) 3. sanitize any user inputs (text, images, anythg..), and be obviously very careful when rendering them 4. for UX, using refresh tokens as httpOnly, secure, sameSite strict cookie is acceptable
This is cool bro
Thanks bro :)
Important thing to highlight that such an approach is great for web browser applications but not a good idea to follow it if we are creating same Auth API for IOS or Android as they don't have the cookies mechanism.
th-cam.com/video/uXDnS5PcjCA/w-d-xo.html&ab_channel=LearnWebCode
For browser-based applications: When the user logs in or authenticates, your server can generate a JWT token and set it as a cookie in the HTTP response. The cookie should have the HttpOnly flag set to prevent client-side JavaScript access for enhanced security. The browser will automatically include this cookie in subsequent requests to your API. For native mobile applications: In the case of native mobile applications, cookies are typically not managed by the application directly. Instead, you can handle the token management manually by extracting the JWT token from the server's response and storing it securely within the mobile application. You have several options for storing the token securely, such as using the Keychain (iOS) or Keystore (Android) mechanisms mentioned earlier.
Nice but csrf?
Problem with this method is, if someone gets the refresh token, they may infinitely keep on getting new tokens. One would say, to tackle this issue, keep the expiry time of small duration. However, it’ll create another issue. Suppose, if I shut down my system and come back the next day, the refresh token would have expired by now. Therefore, I’ll have to log in again. What could be the potential solution to such problems?
Did you work in WD before?
Why does the thumbnail looks like a meme
There’s nothing wrong with storing tokens in local storage. If your site has XSS vulnerabilities, you have much bigger issues.
Thank you
Thanks. Concise examples of a modern testing pattern. Much appreciated
Good work. Where are the rest of series? Are you going to work on the next episodes in the series?
Thanks for this Kati!
very well explained
Haha did he just say "bug free application"? 😂🤣
Great info and thank you for sharing sir, I can see you are setting the new token to the header after the request inorder to persist it. How can you do this with axios, meaning how can you set a header after request with axios or am I missing something.
Hey, I went to your site and signed up for the react testing class and the videos were set to private. I think your videos are really good!
Which text extension do you use?
or theme extension
Thanks so much!
Great explanation!
How would you handle same application in multiple tabs? Or on multiple devices?
excellent tutorial! explained in a crisp & understandable way. thank you very much. :)
Wow.. I keep learning about new CMS apps each day.. gonna give this a try
he BOUGHT the software hahahahahah
Thank u so much, interested in starting so soft during quarintine and just need a place to get started, thx for the support
Great video! have your like good man !
Thanks for the kind words, I'm always happy to help! Let know if you'd like any videos on specific topics in the future. I wish you all the
I have been struggling with building a database for a SaaS application and your video has helped me solve it. Thanks a million Kati
Nice.
Bravo, great explanation, thanks for sharing
by storing the refresh token in a httponly cookie, does it prevent an attacker from using it ? my current set up is quite the same ,storing the access token in memory and returning it in a response body from the server and at the same time the server sets up a httponly cookie containing the refresh token...For now i havent found a way to encrypt and sign the token (i am using ktor for the backend) as i use a call.response.cookies.append() method to set my cookie
How to pass cookies in testing to getserversideprops? I got error Cannot read property 'cookies' undefined
03:44 Backend response 04:06 Not using local storage | Immunity to cross-site scripting attacks
tysm almost a week I searching about the refresh token huhu finally you saved me tysm!
How could a PWA get the user information using this strategy while offline or on a unstable connection?
I know everyone is hyping that don’t store tokens in local or session storage. But the reality is if your application is vulnerable to XSS attacks then an attacker can high jacks your tokens stored even in http only cookie by triggering an fetch request to his malicious domain with credentials set to true. So I personally think that we should give more focus on preventing any sort of XSS vulnerabilities in our site rather than deciding where we store our tokens. Personally I prefer session storage as it expires when user closes browser tab. Also please note that I am not saying that author is completely wrong. This is a good quality video. Just saying that this approach will also fails if we have XSS vulnerability.
If the cookie is set with the sameSite flag, then the attacker will not be able to trigger a fetch request to his malicious domain.
You could configure CORS for specific domains of your clients.
Exactly 💯
Hello Franz, very nice video!! Great content too! However, you left out something. The cookie holding the refresh token is still susceptible to CSRF attacks. And once that happens, it’s game over. HttpOnly alone won’t save the cookie from CSRF attacks. You need additional settings on the refresh-token cookie 🍪 for GraphQL. Namely: Path: /graphql; Domain: localhost:4500; SameSite: Strict. Now, with these additional settings, the refresh-token cookie is not vulnerable to CSRF via abuse of ambient authority on cross-site, cross-domain scenarios
Hi Ifeora, i want ask different question , why i need refresh token? i mean if the security comes from the cookie flags((flags: HttpOnly + Secure + SameSite )) , so why i even need to refresh token ? why not to simply store the access token in the secure cookie flags (flags: HttpOnly + Secure + SameSite )
access tokens should never be long lived, their lifetime is usually 60 min. refresh tokens last much longer, usually 45 days or more. If you are making access tokens long lived, please apologize to your senior and quit the industry immediately.
@@undefined69695 I don't understand the relationship between what i said and your response. Cheers
I do not understand why people completely stopped talking about CSRF-attacks. Developers actually stopped using httpOnly cookies and went for localStorage for a reason. Cookies, httpOnly or not, are very much prone to an attack. They are not prone to an XSS-attack but they are prone to a CSRF-attack. localStorage are not prone to CSRF though. And if XSS does happen then even with well protected cookies an attacker has huge power and still is able to make a lot of damage.
No expert, but I think the new suggestion is to use sameSite strict or lax.
Hi, isn't the refresh token is vulnerable to CSRF attack?
This is amazing
Thanks, man.