3 Ways to Code a BuzzFeed Clone (JavaScript + TypeScript + JSONServer + Database + API + Node.js)

  Рет қаралды 59,045

freeCodeCamp.org

freeCodeCamp.org

Жыл бұрын

Learn how to build a Buzzfeed Clone in JavaScript, followed by a version in React using JSON server for mimicking an API, and then build a TypeScript Buzzfeed Clone with a mini backend using Node.js to communicate with a Database.
💻 Final code:
github.com/kubowania/buzzfeed...
github.com/kubowania/buzzfeed...
github.com/kubowania/buzzfeed...
✏️ Course developed by @AniaKubow
🎉 Thanks to our Champion and Sponsor supporters:
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Erdeniz Unvan
👾 Justin Hual
👾 Agustín Kussrow
👾 Otis Morgan
--
Learn to code for free and get a developer job: www.freecodecamp.org
Read hundreds of articles on programming: freecodecamp.org/news

Пікірлер: 70
@AniaKubow
@AniaKubow Жыл бұрын
Thanks so much for your continuous support of FreeCodeCamp and my own channel. 🙌🙌
@smsibasish
@smsibasish Жыл бұрын
Ania you're a superstar ✨️ Love your consistency and resilience to put out quality content regularly. Keep it up. Keep inspiring 💯
@broadcastdave
@broadcastdave Жыл бұрын
I love your course so far
@AniaKubow
@AniaKubow Жыл бұрын
@@broadcastdave thanks so much Dave! I am glad you are enjoying it :) hopefully see you at the show and tell tomorrow
@eltongino3697
@eltongino3697 Жыл бұрын
Thank you for all the amazing content that you do
@AniaKubow
@AniaKubow Жыл бұрын
@@smsibasish so kind of you to say Sibasish! Thanks for taking the time to write this lovely comment :)
@SandeepBadarla
@SandeepBadarla Жыл бұрын
ania you are just amazing !!!! you are always explaining way better from tutorial to tutorial . By the way that spects suits to you :)
@AniaKubow
@AniaKubow Жыл бұрын
Thanks so much for your kind words Sandeep! You rock 💪
@SandeepBadarla
@SandeepBadarla Жыл бұрын
@@AniaKubow Wow i really got a reply from you?!! Thanks for the reply
@znull3356
@znull3356 Жыл бұрын
Start of Vanilla Javascript: 0:58 Start of React: 1:01:07 Start of TypeScript: 2:22:21
@crystalmind7180
@crystalmind7180 Жыл бұрын
How to memorize all of it at the same time? .. Lol. I'm working with a lot of memory-related stuff also I'm dealing with 12-digit codes. But I have to admit. I'm lost over here. I truly appreciate all of this info. I must watch this vid for several times now to be able to memorize at least a bit from all of it. Massive thank you for your time.}}}
@aworden
@aworden 10 ай бұрын
Thanks for putting this tutorial together Ania. It has been great so far for me to follow along and has inspired me to do a ton of research in order to understand each thing you're doing. I'm a long-time Java coder (since java 1.1) - so the JS syntax is hard for me to grok. It would be so much easier if you could provide an explanation behind the code you are typing since JS and JSX syntax is incredibly unintuitive to read.
@movefast
@movefast Жыл бұрын
Thank you Ania for creating this wonderful course.
@thejudge9353
@thejudge9353 Жыл бұрын
Can't wait to start building.
@chrisco2323
@chrisco2323 Жыл бұрын
I watched for an hour and only got to 6m 45s, because though I've used VSCode for years, I'd like to know what some of these extensions you're using are. In particular, how are you getting the thing where you hover over the HTML and it highlights on the page? I mean this looks like Dev Tools but I don't find the right extension to do it from VSCode. Also, how did you get the code-folding in the html? Prob. other extensions I need to know about, but 6m 45s, went down those rabbit holes.
@soundsahmed
@soundsahmed Жыл бұрын
ممتازة ماشاءالله
@shiroyasha69
@shiroyasha69 Жыл бұрын
I have started learning web development and as my first project I created a fake weed selling webpage which rick rolls you when you order from it . Many of my friends fell for it😂.
@joele2857
@joele2857 Жыл бұрын
I need this!!!
@AniaKubow
@AniaKubow Жыл бұрын
🥰
@dev_100rbh
@dev_100rbh Жыл бұрын
Is it for beginners 😁
@ru2979
@ru2979 Жыл бұрын
Ania yaaay 🥺 Luv U Anya
@AniaKubow
@AniaKubow Жыл бұрын
😃😃😃
@Xton618
@Xton618 Жыл бұрын
wow
@statistikinferensial9972
@statistikinferensial9972 Жыл бұрын
😊👍thanks🙂
@miguelthekassett
@miguelthekassett 9 ай бұрын
Why does my Swagger UI have no 'collections' option? I just have rows, tables and columns as options
@alkismavridis1
@alkismavridis1 Жыл бұрын
I think one buzz feed in the world in one too much. Please not let it multiply. Still, the video was awesome, thanks!
@AniaKubow
@AniaKubow Жыл бұрын
😂😂
@obaid5761
@obaid5761 Жыл бұрын
I was thinking the exact same thing lmao
@brucehussian7257
@brucehussian7257 Жыл бұрын
Love it❤
@AniaKubow
@AniaKubow Жыл бұрын
💪💪
@pingachm
@pingachm Жыл бұрын
35:29 my bookmark lol
@sarundayo
@sarundayo Жыл бұрын
Or we can have ChatGPT build the code! Couldn't be any worse than BuzzFeed itself :DD
@obaid5761
@obaid5761 Жыл бұрын
😂
@an8by
@an8by Жыл бұрын
next tutorial on flask please
@FUS-ON-XTRA
@FUS-ON-XTRA Жыл бұрын
Hello love your videos would gladly appreciate a video on Roblox Luau language
@atifaslam655
@atifaslam655 Жыл бұрын
Plz build app with react native
@ojasvisingh786
@ojasvisingh786 Жыл бұрын
🤩🤩♥️👏👏👏
@albart1732
@albart1732 Жыл бұрын
Technically interesting but it's better there is no clone from site like this in internet
@ghostgamerbgmi
@ghostgamerbgmi Жыл бұрын
👍
@AniaKubow
@AniaKubow Жыл бұрын
😃
@husseinalkadasi7668
@husseinalkadasi7668 Жыл бұрын
And group of C++ pleas
@clownbasher2911
@clownbasher2911 Жыл бұрын
If you create a new buzzfeed , i wil come over and eat your pets! 😛
@spraveenitpro
@spraveenitpro 5 ай бұрын
Please change your ide to something that does not show unwanted hints that need constant disabling, thanks.
@PhobosTK
@PhobosTK Жыл бұрын
>3 Ways to Code a BuzzFeed Clone Will it go broke like the original one?
@husseinalkadasi7668
@husseinalkadasi7668 Жыл бұрын
Can u give me a group of IT
@Xton618
@Xton618 Жыл бұрын
Well, I want to be a web developer, come on pretty wish me luck♡ if you love javascript then it's a pleasure 🤵‍♂️
@mxc8mxc
@mxc8mxc Жыл бұрын
women
@katrinatyler675
@katrinatyler675 Жыл бұрын
Investing is not for everybody, you just need a strong stomach too see your portfolio go down. It might be wiser for a novice to start with Index investing, but it is not easy. My point is that when investing you need education first. To invest in growth stocks it is another level, definitely you need to know what are you doing.
@katrinatyler675
@katrinatyler675 Жыл бұрын
From my own point of view, you need to invest smartly if you need the good things of life. so far i've made over $255k in raw profits from just 6 months into the market from my diversified portfolio strategy and i believe anyone can do it you have the right strategy, mutual funds takes long time but investing smartly is the key for short term. Most of us tend to pay more attention to the shiniest position in the market to the cost of proper diversification.
@benjaminotto5711
@benjaminotto5711 Жыл бұрын
This is a phenomenal advice for a new stock traders and investors who want that quick short term game, but don't see the light at the end of the tunnel.
@d_ken
@d_ken Жыл бұрын
@@katrinatyler675After I got screwed in the Tech bubble years ago I've been solely investing in real estate. But with the recent hyper home pricing i've liquidated a few things and have $318k in cash laying around idle. Would love to get your recommendations, I'm in search of something lucrative in the current crazy markets, i will be glad.
@risechess7114
@risechess7114 Жыл бұрын
1:58:41 she's manipulating the state and this is a big mistake she should create function inside the setUnanweredQuestionIds(prevState => prevState.filter(id=>id != quizItemId) like this, all of you keep saying thanks and not understand anything
@NorweskiDrwal
@NorweskiDrwal Жыл бұрын
That makes sense. BuzzFeed is a useless service, recreating it shouldn’t take more than 4hrs ;)
@HolyReV
@HolyReV Жыл бұрын
Father God Loves You so Much ❤️
@BurnLikeAFlame
@BurnLikeAFlame Жыл бұрын
Hail Odin, the allfather!
@risechess7114
@risechess7114 Жыл бұрын
she keeps looking right side like she is copying and paste cheating...
@Almighty_Flat_Earth
@Almighty_Flat_Earth Жыл бұрын
React js is a blasphemy for JavaScript community. React nonsense must be banned across world plane. This f library makes web development unnecessarily complicated. Angular is far better than svelte and react nonsense., because it leverages rxjs subscription, angular service make communication between sibling components much easier, developers know what exactly is happening. Svelte and react have confusing code. Developer experience matters.
@ahmetkeremakll8629
@ahmetkeremakll8629 Жыл бұрын
HELP TURKEY PLEASE 😔
@risechess7114
@risechess7114 Жыл бұрын
she's not professional and she doesn't fix the errors in live mode, she should fix the error in live mode so we can learn how to debug, she's always copy and pasting and not explaining anything, she does not belong to freeCodeCamp family
@JoeyCrackization
@JoeyCrackization Жыл бұрын
Why would I want to build such a garbage website?
@the_god_killah
@the_god_killah 8 ай бұрын
Top 5 dumbest coding comments of 2023!
@thomasbauer2489
@thomasbauer2489 Жыл бұрын
👍
@AniaKubow
@AniaKubow Жыл бұрын
💪💪
Code a Reddit Clone with React, Next.js, Firebase v9, Chakra UI - Full Course
11:43:32
C# Certification (FreeCodeCamp + Microsoft) Week 1 Mastermind
1:30:06
Major Guidance Solutions
Рет қаралды 236
Fail haircut 💇‍♀️🪀🏓 #hair #cut #haircut
00:26
Swasti Ji
Рет қаралды 15 МЛН
ТАКОГО НЕ МОЖЕТ БЫТЬ😲😲😲
00:18
Chapitosiki
Рет қаралды 13 МЛН
Baby Yoda toothpaste cap
00:43
Alina Saito / 斎藤アリーナ
Рет қаралды 22 МЛН
I tried 10 code editors
10:28
Fireship
Рет қаралды 2,7 МЛН
Making Minecraft from scratch in 48 hours (NO GAME ENGINE)
16:38
How Senior Programmers ACTUALLY Write Code
13:37
Healthy Software Developer
Рет қаралды 1,2 МЛН
Every CSS Animation property
9:26
chunkydotdev
Рет қаралды 5 М.
СОБЕСЕДОВАНИЕ FRONTEND ЗП 220к JS, TS задачи
49:02
Кодерские собесы
Рет қаралды 71 М.
Making A Billion-Year Lego Clock
13:11
Brick Technology
Рет қаралды 6 МЛН
Computer & Technology Basics Course for Absolute Beginners
55:04
freeCodeCamp.org
Рет қаралды 2,5 МЛН
Back End Developer Roadmap 2024
10:30
freeCodeCamp.org
Рет қаралды 222 М.
I Tried Making a 3D RPG Game in JavaScript
14:19
SimonDev
Рет қаралды 1,1 МЛН
Fail haircut 💇‍♀️🪀🏓 #hair #cut #haircut
00:26
Swasti Ji
Рет қаралды 15 МЛН