- 103
- 365 610
NL Tech
Bulgaria
เข้าร่วมเมื่อ 14 เม.ย. 2012
Welcome to NL Tech. This is an educational channel focused on Computer Science and Software Engineering.
Automated Testing 👨💻 Develop an App from Scratch (Part 15)
In this episode, I dive into building an automated testing suite for Budget Warden, my personal finance budget tracking app.
I will attempt to explain what automated tests are, why they’re necessary, and how they improve software quality.
I explore the basics and the different types of tests-unit, integration, and end-to-end-before outlining a tailored testing strategy for Budget Warden, a full-stack application with a:
- Web client
- Fastify Node.js RESTful API using TypeORM
- React-based UI components library
In this video, I showcase my end-to-end tests, including visual testing, and walk through setting up unit tests for the backend API using Jest. Watch as I configure Jest, establish a testing database connection, and explain how the testing suite will integrate into the development workflow.
Repositories:
bw-monorepo: github.com/nikelaz/bw-monorepo
Playlist:
th-cam.com/video/Z3OEsK2fUl8/w-d-xo.html
Contents:
0:00 Introduction
1:31 Types of Tests
7:13 Testing Strategy
10:14 End-To-End Tests with Playwright
24:40 Backend Service Unit & Integration Tests with Jest
Social Media:
Email: nikola.n.lazarov@outlook.com
Twitter: nikelaz
LinkedIn: www.linkedin.com/in/nikola-lazarov
#testing #jest #playwright
I will attempt to explain what automated tests are, why they’re necessary, and how they improve software quality.
I explore the basics and the different types of tests-unit, integration, and end-to-end-before outlining a tailored testing strategy for Budget Warden, a full-stack application with a:
- Web client
- Fastify Node.js RESTful API using TypeORM
- React-based UI components library
In this video, I showcase my end-to-end tests, including visual testing, and walk through setting up unit tests for the backend API using Jest. Watch as I configure Jest, establish a testing database connection, and explain how the testing suite will integrate into the development workflow.
Repositories:
bw-monorepo: github.com/nikelaz/bw-monorepo
Playlist:
th-cam.com/video/Z3OEsK2fUl8/w-d-xo.html
Contents:
0:00 Introduction
1:31 Types of Tests
7:13 Testing Strategy
10:14 End-To-End Tests with Playwright
24:40 Backend Service Unit & Integration Tests with Jest
Social Media:
Email: nikola.n.lazarov@outlook.com
Twitter: nikelaz
LinkedIn: www.linkedin.com/in/nikola-lazarov
#testing #jest #playwright
มุมมอง: 109
วีดีโอ
Microsoft GenAIScript 🚀 First Look
มุมมอง 1.1Kวันที่ผ่านมา
In this video I take a first look at GenAIScript, Microsoft's innovative scripting language designed to prompt large language models (LLMs). This tool enables you to integrate LLMs into your more mundane workloads, (maybe) automating tasks. In this video, I'll take a look and try to decipher the core features of GenAIScript, some of these seem to be: - File Input/Output: Feed data to your LLM f...
Try/Catch Alternative - Simpler Error Handling ⚠️ in JavaScript
มุมมอง 1.7K21 วันที่ผ่านมา
There are a couple articles and videos about a possible safe assignment operator proposal for ECMAScript/JavaScript. The proposal will not happen but will instead be replaced with a similar try expressions proposal that could possibly happen in the future. In this video I will show you an alternative way to achieve the same syntax with widely supported JavaScript language features today as thes...
Sankey Diagram and Scales 👨💻 Develop an App from Scratch (Part 14)
มุมมอง 138หลายเดือนก่อน
In this video I will explain how I implemented the data visualization components in the reporting section of the web client. They include a custom scales component that behaves like a progress bar with a balance section, but also has an overflow state, where the progress bar is larger than its wrapper. The other component is a Sankey diagram/chart which I was able to implement with chart.js by ...
Linux 🐧 Full Stack JavaScript Development Environment Setup
มุมมอง 261หลายเดือนก่อน
In this video, I will show you how to set up a full stack JS development environment on Linux. I will cover the following topics: - Choosing a Linux distribution - Picking a package format (deb/rpm or flatpack/snaps) - Installing browsers (Chrome, Chrome Dev, Chromium and Firefox), multiple versions for development and personal use - Installing and managing multiple versions of NodeJS with Node...
Gemini AI Code Assistant: A Free LLM Code Assistant for VSCode, JetBrains and Zed
มุมมอง 1.9K2 หลายเดือนก่อน
Discover how Google's Gamini LLM Code Assistant can help you code. Learn how to seamlessly integrate Gamini into your favorite IDE or code editor, including Visual Studio Code, JetBrains, and Zed. I demonstrate how to prompt the AI Model/LLM to generate code inline and how to use the interactive chat panel as Gamini provides instant code suggestions, explanations, and even generates entire code...
Zed Code Editor: A Comprehensive Review
มุมมอง 19K3 หลายเดือนก่อน
Zed Code Editor is a performance and collaboration focused, rust-based code editor. In this video, we'll take a deep dive into the editor, exploring its key features, performance, and ease of use. We'll start by discussing the team behind Zed and the approach they've taken. Next, I'll guide you through the installation process. Then, we'll delve into the editor's most impressive features, inclu...
The Strategy Design Pattern in JavaScript: A Sorting Example
มุมมอง 1113 หลายเดือนก่อน
In this video, you'll learn how the Strategy Pattern can make your code more flexible and maintainable. We'll create a versatile Sorter class using the strategy design pattern that supports both MergeSort and QuickSort as interchangeable strategies. Join us as we explore the benefits of having a single API that supports multiple algorithmic strategies. You'll gain a deeper understanding of this...
New JavaScript Features 🆕 Grouping with Object.groupBy and Map.groupBy
มุมมอง 1763 หลายเดือนก่อน
Learn how to group data effortlessly in JavaScript with Object.groupBy and Map.groupBy. These powerful methods provide a concise and intuitive way to categorize data based on specific criteria. We'll guide you through their implementation and explore their advantages over traditional grouping techniques. Contents: 0:00 Introduction 0:26 Object.groupBy Basic Demo 1:53 Grouping by a Custom Key 3:...
Web Client Architecture 👨💻 Develop an App from Scratch (Part 13)
มุมมอง 2.3K4 หลายเดือนก่อน
In this video I will work on the Next.js web client application for Budget Warden (the budget tracking application that I am developing from scratch). Some of the topics I will cover include: - Implementing scalable layouts in Next.js - Global state management with the container/view model design pattern and React context - Using Next.js server side actions to execute server-to-server HTTP requ...
Next.js Authentication 👨💻 Develop an App from Scratch (Part 12)
มุมมอง 4864 หลายเดือนก่อน
In this video I will demonstrate how to implement JWT authentication in a Next.js client. We'll build a complete system from scratch, covering: - Login View: Craft a user-friendly interface for secure sign-in. - Authentication Hook: Guard your precious app routes for authorized users only. - Registration View: Implement a smooth user sign-up process. Repository: bw-monorepo: github.com/nikelaz/...
Level Up Your Code 🚀 Blazing Fast Lookups with Hash Maps
มุมมอง 2395 หลายเดือนก่อน
Level Up Your Code 🚀 Blazing Fast Lookups with Hash Maps
Coolify 🖥 Self-Hosted Vercel/Netlify/Heroku Alternative 🚀
มุมมอง 7K6 หลายเดือนก่อน
Coolify 🖥 Self-Hosted Vercel/Netlify/Heroku Alternative 🚀
Navigation and Dropdown Components 👨💻 Develop an App from Scratch (Part 11)
มุมมอง 2586 หลายเดือนก่อน
Navigation and Dropdown Components 👨💻 Develop an App from Scratch (Part 11)
Table, Data Grid and Modal Dialog Components 👨💻 Develop an App from Scratch (Part 10)
มุมมอง 5446 หลายเดือนก่อน
Table, Data Grid and Modal Dialog Components 👨💻 Develop an App from Scratch (Part 10)
What's New in Fedora 40 🐧 Gnome 46 & Linux Kernel 6.8
มุมมอง 7997 หลายเดือนก่อน
What's New in Fedora 40 🐧 Gnome 46 & Linux Kernel 6.8
Form Components 👨💻 Develop an App from Scratch (Part 9)
มุมมอง 3367 หลายเดือนก่อน
Form Components 👨💻 Develop an App from Scratch (Part 9)
Components Library with Vite & Storybook 👨💻 Develop an App from Scratch (Part 8)
มุมมอง 2.6K7 หลายเดือนก่อน
Components Library with Vite & Storybook 👨💻 Develop an App from Scratch (Part 8)
Tailwind CSS Theme Setup 👨💻 Develop an App from Scratch (Part 7)
มุมมอง 6268 หลายเดือนก่อน
Tailwind CSS Theme Setup 👨💻 Develop an App from Scratch (Part 7)
Docker Dev Environment with DB, Server and Client 👨💻 Develop an App from Scratch (Part 6)
มุมมอง 7439 หลายเดือนก่อน
Docker Dev Environment with DB, Server and Client 👨💻 Develop an App from Scratch (Part 6)
RESTful Node.js Controllers with Fastify 👨💻 Develop an App from Scratch (Part 5)
มุมมอง 1.1K9 หลายเดือนก่อน
RESTful Node.js Controllers with Fastify 👨💻 Develop an App from Scratch (Part 5)
Control Flow in Rust: if/else, Loops & More! 🦀 Intro to Rust #6
มุมมอง 789 หลายเดือนก่อน
Control Flow in Rust: if/else, Loops & More! 🦀 Intro to Rust #6
Fastify User Authentication with JWT 👨💻 Develop an App from Scratch (Part 4)
มุมมอง 2.7K9 หลายเดือนก่อน
Fastify User Authentication with JWT 👨💻 Develop an App from Scratch (Part 4)
New Array Methods in JavaScript 🆕 ES14
มุมมอง 2609 หลายเดือนก่อน
New Array Methods in JavaScript 🆕 ES14
TypeORM Models and Validation 👨💻 Develop an App from Scratch (Part 3)
มุมมอง 1.6K9 หลายเดือนก่อน
TypeORM Models and Validation 👨💻 Develop an App from Scratch (Part 3)
UI/UX Design 👨💻 Develop an App from Scratch (Part 2)
มุมมอง 1.3K10 หลายเดือนก่อน
UI/UX Design 👨💻 Develop an App from Scratch (Part 2)
Software Architecture 👨💻 Develop an App from Scratch (Part 1)
มุมมอง 2.9K10 หลายเดือนก่อน
Software Architecture 👨💻 Develop an App from Scratch (Part 1)
Render a Rich Text (Blocks) Field in React 🚀 Strapi Course #9
มุมมอง 3.8K10 หลายเดือนก่อน
Render a Rich Text (Blocks) Field in React 🚀 Strapi Course #9
PC Build for Development and Video Editing - Fractal Design Pop Mini Air & Intel 12th Gen
มุมมอง 2.8K11 หลายเดือนก่อน
PC Build for Development and Video Editing - Fractal Design Pop Mini Air & Intel 12th Gen
GraphQL Plugin Queries & Mutations (CRUD) 🚀 Strapi Course #8
มุมมอง 99111 หลายเดือนก่อน
GraphQL Plugin Queries & Mutations (CRUD) 🚀 Strapi Course #8
you rock my friend!
hi which font you are using?
is there any for woocommerce ? includes, cart functions, checkout, user auth etc?
Try zen
@@iammithun.u20 Ok, I will
Please continue finance app.
@@Engineer-de8ps I am working on the videos. You can expect them in the upcoming weeks. 🙂
1:13 is that zed from league of legends? :o
nice video btw
This is what I did. Try is a reserved keyword so it doesn’t work as a function name /** * Wraps a function in a try-catch block, returning either an error or a result as a tuple. * Works seamlessly for both sync and async functions. */ export function safe<TArgs extends any[], TResult>( fn: (...args: TArgs) => Promise<TResult> ): (...args: TArgs) => Promise<[unknown, null] | [null, TResult]>; export function safe<TArgs extends any[], TResult>( fn: (...args: TArgs) => TResult ): (...args: TArgs) => [unknown, null] | [null, TResult]; export function safe<TArgs extends any[], TResult>( fn: (...args: TArgs) => TResult | Promise<TResult> ): (...args: TArgs) => [unknown, null] | [null, TResult] | Promise<[unknown, null] | [null, TResult]> { return (...args: TArgs): any => { try { const result = fn(...args); if (result instanceof Promise) { return result .then((value) => [null, value]) // Success case .catch((error) => [error, null]); // Error case } return [null, result]; // Success case for sync } catch (error) { return [error, null]; // Error case for sync } }; }
You are correct. I wrongly suggested try without thinking it through. Safe works too…
All pages/links you are using in the video should be also in video description
EcmaScript is turning into Golang
Hipsters discovered error handling)
@oPOCCOMAXAo I'm a gopher, it's fine :)
@@oPOCCOMAXAo I'm a gopher, it's fine :)
Absolutely can't understand half the words. It would really help to pronounce when you talk…
I appreciate the feedback. I’ll attempt to improve that.
I understood him fine
This is basically Effect TS on steroids if you really wanna make your code more powerful _cough_ _cough_ complex
this can literally be implemented with simple function function try<T>(f: () => T): Result<T, unknown> { try { return { type: "ok", value: f() }; } catch(e) { return { type: "error", value: e }; } } const {type, value} = try(() => someThingThatMightThrow());
@@coffee-is-power Absolutely.
That's really cool, like how it simplifies the code a lot, I guess Rust is actually making other languages better after all
@@whilelab Absolutely! Rust, Swift, Go and the other modern languages are influencing old languages.
Interesting! Thanks so much for sharing!
Nice. Keep up the good work
Very useful!
great work ! 🔥
Thank you! Appreciate it!
I love this, I don’t understand why my coworkers don’t do it more
great bro
Thanks
All these Coolify tutorials are all showing the same damn thing: How you to install - and that's it. Instead of showing networking, security, firewall, DNS, migrations etc..
I agree with you, however when I'm making a video I have to make a decision about the level of depth I'm willing to go into. This is an introduction for people who have no idea Coolify even exists. If I am about to go into details like the ones above, I would make a separate video. The thing is, I think a written documentation will always be a better option if you want to learn specific details about firewall configuration for example. I understand your frustration tough.. sorry about that.
Man this REALLY save my life, appreciate a lot
I"m glad you found it useful!
Watching this video i got answer to the question if arch can be used on any server. Answer is yes! So from what i managed to discern here this two settings are most important: kernel has to be LTS and profile for packages must be server.
Yes, it can. The only downside is that if you want to follow best practices and have a secure server you have to update it frequently (like every two weeks).. because that's just the nature of rolling release distros. If you go with something like Debian Stable/RHEL, you could update the server less frequently, which can be beneficial in some cases if you just don't want to deal with it. :)
@@nltech1 if i had server on top of arch i would update once a month not every 2 weeks plus with LTS updates are generally less frequent which is why LTS kernel targets server.
Sure, you can update as frequently as you want, but the kernel is not the only package you will have on your server. Let's say you use nginx for example and the latest version you have installed on your arch system has a security vulnerability that gets discovered - every day that you do not update your server since the vulnerability was discovered is a security risk, which is why the sooner you update the better. On non-rolling release distros the same risk exists, but its mitigated a bit (only a bit, not completely), because the versions of software will be a bit older and you avoid the possibility for new security vulnerabilities in recently introduced code (in all of your packages). That's theoretical tough.. In reality no one will probably attempt to exploit a security vulnerability on your server immediately if you're not hosting a very important piece of software which has a lot of visibility. I also update my home server every 1-2 months or so.. but it is on a closed network and has data that is not really important or valuable.
@@nltech1 still you can reduce frequency of updates on your server if you choose packages carefully because each package is updated at different prequency. Nginx for example is updated reqularily still it's enough if update nginx once a month for example. As eric dubois said arch is all about choices and your choice of set of packages has great influence over how frequently you get updates so for server less frequent they are it's better for server. You also need to keep in mind that most vulnerabilites are patched in linux world before they're even exploited, few remain hidden for long time.
Ummmm....Arch Linux is actually available and downloadable from the Microsoft Store (Arch WSL). At least, I was able to download it. What next?
Thanks for the video, Very helpful!
Thank you! Appreciate it!
So slug in Dutch is pronounced something like " swerk"
Una cagada tu video
awesome video! Glad I found your channel, keep up the great work
Thank you! Will do!
It was help full brother, thanks.
Glad it helped
it seems we can not use ACF on wordpress anymore,
Can you be more specific? What happened to ACF? I used it for a project two weeks ago.
I think it changed the name into Secure Custom Field, as i see active users and reviews had same amount with this video
after installing the appx, running the program just launches a terminal to [root@LAPTOP-M8BE0R68 ~]# with nothing else, no installation or anything automatic like what you showed
How are the temps.
any tutorial to check git changes? or manage remote? push / pull?
There's no git changes and stash support for now. If you want to control you changes then install any git ui. Zed's guys promise release support in the future
thanks to this tutorial, now i can proudly say: I use arch btw :D
th-cam.com/users/shorts98YeNLhDROo?si=WCPV32A3bLsG4SXh
The video was perfect, But I wished you have putted the mic top of your head where the camera can not capture the mic, so we can clearly your face and it will have a better impression too.
Amazing tutorial. Very clear, even in the more intricated parts. 👏👏
@@Devver-13 Thank you! I appreciate the feedback.
I still can't get Tailwind autocomplete, any help?
5 months of use it, I hate VSCode and Microsoft.
I'm loving everything about this editor so far. Seems like a good alternative to vscode.
I have tried in my local and published it but after installing in test project getting error like, Cannot read the properties of null ( reading useContext ). But believe me there is no useContext used in my project. After that i installed other react component libraries from npmjs but they are also giving same issue, even after installing all peer and dependencies. Any solution for this ?
make a video on how to add preview button or preview content before publishing
Wow I tough we could do it only with GraphQL, very cool! Is it possible to do Post, Put and Delete requests to a Wordpress related MySQL database like this?
Did you manage to figure out authentication?. When users want to interact on a post, they have to be authenticated
How does it compare to Claude Dev and Cursor?
this is the ONLY normal Strapi tutorial on youtube, without yelling, unbearable accent, or other bullshit content :) Thank you for that 🙏
zed looks awesome.waiting for flutter support
They already have the language server as extension
@@RickbyTH-camr gonna try that
Thanks for explaining in this detail ❤
can you do a react new playlist, thanks
ssh and remote development is sorely lacking making it pointless to fire up, writing it in rust was a poor choice, the maintenance and churn required to push out features that will attract users is a mountain they can't climb. 1st round of funding everybody is jazzed, then renewal comes up and they look at the marketshare performance.... minuscule. They look at feature output versus VS Code / JetBrains... CHASM. REPO is archived, "welp we tried" blog post go up, Zed gets donated to the Rust Foundation to rot.
i'm very young dev and i’m looking to deploy my app. I’ve purchased a Hetzner server, and I want to deploy my app on Coolify. However, I’m not sure how to do this. My app stack includes Vite.js, Node.js, and MongoDB. The app is designed to display items and allow users to purchase them. Everything works fine locally, but I don’t understand how to deploy it. Could someone please guide me on how to proceed? Let me know if you need further adjustments! I’ve tried several things but would like to start on the right track.
Please continue building budget project please dude😊😊