- Видео 17
- Просмотров 114 911
CodeSnaps
Германия
Добавлен 30 май 2023
Welcome to CodeSnaps! I'm Kaumon, and this channel is all about web development in a snap. Join me as we explore various coding techniques, tips and tricks. Get ready to have a great time diving into the world of web development!
The Only LangChain.js Course You Need (Part 1): Getting Started with the Best LLM Framework
This is the first video in a series about LangChain, the most popular LLM framework for building AI applications like ChatGPT. In this video you will learn about the foundation and basics of LangChain.js.
### 👨🏻💻 Here’s What You’ll Learn
- What is LangChain.js and why you should use it
- How to set up LangChain.js in a new project
- How to create prompt templates
- How to use system and human messages
- How to use LangChain Expression Language (LCEL)
- How to create chains with the model
- How to use the output parser
- How to use runnable sequence
- How to use streaming
- How to batch process prompts
### 👇 Timestamps:
00:00 Intro
00:39 Setup and Installation
01:09 Invoke Model
02:05 Prompt Templates
04...
### 👨🏻💻 Here’s What You’ll Learn
- What is LangChain.js and why you should use it
- How to set up LangChain.js in a new project
- How to create prompt templates
- How to use system and human messages
- How to use LangChain Expression Language (LCEL)
- How to create chains with the model
- How to use the output parser
- How to use runnable sequence
- How to use streaming
- How to batch process prompts
### 👇 Timestamps:
00:00 Intro
00:39 Setup and Installation
01:09 Invoke Model
02:05 Prompt Templates
04...
Просмотров: 185
Видео
World's Shortest Next.js 13 Course
Просмотров 1114 месяца назад
This is the shortest Next.js course you'll ever take. Learn how to create a new Next.js app, style it, create pages and routes, fetch data, implement streaming and loading stages, create custom route handlers, custom error pages, and more. 📚 Materials/References: Code: github.com/CodeSnaps/worlds-shortest-nextjs-course 👨🏻💻 Here’s What You’ll Learn - What is Next.js? - How to create a new Next....
Everything You Need to Know about Streamlit
Просмотров 1324 месяца назад
Learn how to turn your Python scripts into web apps using Streamlit. Streamlit is a Python library that makes it easy to create and share beautiful, custom web apps for machine learning and data science. No experience in HTML, CSS, or JavaScript is required. 📚 Materials/References: Code: github.com/CodeSnaps/streamlit-crash-course 👨🏻💻 Here’s What You’ll Learn - What is Streamlit - How to insta...
Build Charts in React With Recharts in 7 Minutes
Просмотров 32 тыс.Год назад
Learn how to create beautiful charts in React with Recharts, a charting library built specifically for React. Once you understand how to create one chart, you can pretty much create any chart you can imagine. 📚 Materials/References: Code: github.com/CodeSnaps/recharts-library 👨🏻💻 Here’s What You’ll Learn - What is Recharts - How to install Recharts - How to create an area chart, bar chart, and...
Build Stunning Documentation With React & Docusaurus (Complete Guide)
Просмотров 25 тыс.Год назад
Learn how to create stunning documentation in minutes with React and Docusaurus. Spend more time building your product and less time writing your documentation. 📚 Materials/References: Code: github.com/CodeSnaps/docusaurus-guide Here’s What You’ll Learn 👨🏻💻 - What is Docusaurus - Install Docusaurus - Creating your own documentation - MDX (Markdown JSX) - Import components into Markdown - Using...
The Only JavaScript Cheat Sheet You Need (For Beginners & Pros)
Просмотров 1,2 тыс.Год назад
Welcome to the ultimate JavaScript cheat sheet, your go-to resource to reference and look up everything from the basics to advanced techniques in JavaScript! 👨🏻💻 Here's what you'll learn: - Comments - Console - Variables - Numbers - Booleans - Strings - Assignment Operators - Conditionals - Functions - Scope - Arrays - Array Methods - Iterators - Loops - Objects - Classes - Modules - Promises ...
Next.js 13 Changed Data Fetching and Rendering... But Is It Good?
Просмотров 7 тыс.Год назад
What's the difference between app router, page router, static site generation, static rendering, server-side rendering, dynamic rendering, incremental static regeneration, server components, client components, getStaticProps, getServerSideProps, getStaticPaths, generateStaticParams, and hydration? 📚 Materials/References: Server & Client Components: ruclips.net/video/aoHK8skFZ1U/видео.html 👨🏻💻 ...
Everything You Need to Know About Server Components in Next.js 13
Просмотров 24 тыс.Год назад
With the release of Next.js 13, Next.js officially supports React server components, and here's everything you need to know about server components so you can start building better, faster apps right away. 📚 Materials/References: Code: github.com/CodeSnaps/react-server-components 👨🏻💻 Here's what you'll learn: - What are server components - The difference between server and client components - ...
Beautiful Password Generator using only HTML, CSS, and JavaScript | Step-by-Step Tutorial
Просмотров 223Год назад
Use only HTML, CSS, and JavaScript to create a beautiful password generator. We'll cover everything from creating a colored character-length slider, implementing toggles for including numbers and symbols, copying the password to the clipboard, and even adding a password strength meter. 📚 Materials/References: Full Repository: github.com/CodeSnaps/password-generator-vanilla-js Full HTML Code: gi...
Next.js 13 & Tailwind CSS: Build an Amazing Tip Calculator App in Minutes!
Просмотров 1,3 тыс.Год назад
Build an amazing tip calculator app using Next.js 13 and Tailwind CSS with a step-by-step process to create a fully functional tip calculator app from scratch. Key Takeaways: - Set up a Next.js 13 project and configure Tailwind CSS - Implement server-side and client-side rendering in Next.js 13 - Use the production-ready app router - Build a responsive tip calculator app with a user-friendly in...
Animated Search Bar with HTML, CSS, & JavaScript | Interactive and Engaging UI
Просмотров 1,1 тыс.Год назад
Animated Search Bar with HTML, CSS, & JavaScript | Interactive and Engaging UI
How to Implement Dark Mode in React/Next.js Using Sass
Просмотров 3,3 тыс.Год назад
How to Implement Dark Mode in React/Next.js Using Sass
Thank you very much for you Video
Bro what vs code theme are you using ? 😅
Nice Part1! Good content, good examples ... and understandable!
Dont i need to use try catch?
That was a great explanation touching all the necessary details 👏
Thanks for this quick and crisp video, man. BTW, what's your VScode theme? It looks stunning.
Thanks so much, it's the GitHub Dark Theme :)
Appreciate the clear and concise video format - looking forward to Part 2
that's some quality content ngl thanks for the quick simple walkthrough to integrate react charts
Works great many thanks. I wonder if you would consider a tutorial about adding cookie functionality to this?
Thanks for the tutorial. I want to make a horizontal bar chart like this 📊 but horizontal I can't customize gaps between barchart bars
So good
Thank you very much for your knowledge sharing sir, finally i made my project works perfect this method. Actually i`m working on a React project with Tailwind Css. It Works perfect. Thank you Sir !!!
Such a great video!! Keep it up man 👨💻
Thanks a lot!
Great video
simple and thoroughly explained. Thnks man
Can u also explain how do add a new sidebar, i am trying it but isnt works
@3:15 How did you jump to the folder structure? Could you pls explain? I have locally hosted docusaurus website but can't find the folder structure.
but how we can get the value from the client component to a server component?
good one i might use it thank you
Excellent total. Broke it into understandable steps. Then made it clear once you know the foundation, it becomes easy mode. Well done and thanks.
That was super useful and perfect pace..
❤❤❤❤
Awesome explanation,💫🔥💯❤️🌟
Thanks
Super and Quick Resolution to recharts thanks so much
Thanks
Thanks you so much ! You are great
I am your subscriber now. Kindly post something awesome like this
plz make more videos on charts and dashboards json data plz
Really helpful, Kaumon! Thanks for creating and sharing this wonderful resource.
Jesus, would it kill them to make an interface?!
Thank you , thank you and thank you. You just completely cleared all of my doubts regarding this topic.
Mann..this video is soooo underrated
yes it is
What is your icon theme? It looks so good!
If you have a Typescript error with <Tooltip content={<CustomTooltip />} /> you have to add : - Import TooltipProps from "recharts" - import { ValueType, NameType, } from "recharts/types/component/DefaultTooltipContent"; Finally : const CustomTooltip = ({ active, payload, label, }: TooltipProps<ValueType, NameType>) => {....
Very helpful, thank you!
Great tutorial, just as needed !!!
appreciate the quality of the content
docusaurus doesn't seem to have a search bar. If I have lot's of documents, I won't be able to search them.
It has built-in Algolia search. It's disabled by default that's why you didn't see it in the demo. Instructions on how to enable it can be found in the docs 😊
Hi. I have a question for you. How to customize the data in YAxis ?
that's amazing video on next js Data Fetching and comparison between next 12 vs 13. well done. Thank you for sharing your knowledge on such a this simple and easy way
hey! that was a very nice and super quick walkthrough , thank you so much for this!❤ you got a sub
Very helpful explanation !! Is there a way to mimic getInitialProps in next 13?
cool video but I can hear mouth noises - if you fixed your audio you would get way more subs. Steal fireships audio setup lol
How can I customize the background/hvoer color of a bar group when I hover over them in a bar graph?
😘
That really helps man, thanks !
thanks
Спасибо, друг!!!
Thanks for this amazing guide. What do you suggest if i should use a WordPress for my blogs or use docusaurus for both my documentation and blogs