ASMR Programming - Starbucks Home Page - No Talking

Hello my dear coders,
Please find the seven differences between the origin and the clone page :)
Twitter: / gulnaroglus
👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻
Source code : github.com/servetgulnaroglu/y...
Live a star on github, if you enjoy!
👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻
📦📦📦📦📦📦📦📦📦📦📦📦📦📦📦
All the products in this video
⌨️ Keyboard: IQUnix OG80 Wormhole TTC ACE switches and Costar Stabilizers (5% discount)
iqunix.store/servetgulnaroglu
🖱️ Microsoft Bluetooth Mouse
amzn.to/3R4904L
🖥️ Monitor Asus MX239:
amzn.to/3dulF3k
🖥️ Monitor Dell 34 Curved Monitor - S3422DW:
amzn.to/3BEgmGw
💻 2021 Apple MacBook Pro (14", Chip Apple M1 Pro con CPU 10-core e GPU 16‑core, 16GB RAM, 1TB SSD)
amzn.to/3DHAKJn
🎤 Rode NTG4+ Shotgun Microphone
amzn.to/3LxXcGS
🪵 IOTXY Solid Wood Writing Desk
amzn.to/3qWOQiB
🪑 IWMH Ergonomic Office Chair
amzn.to/3DMPM0l
📦📦📦📦📦📦📦📦📦📦📦📦📦📦📦
00:00 Creating files
00:45 Starbucks SVG
01:00 Navbar
01:15 Running live-server
01:45 Setting the font
02:07 Importing the font
04:43 Location SVG
06:06 Sign in button
09:44 Box shadow generator
10:11 Navbar box shadow
11:12 Starbucks Rewards
14:42 Spotting the text align issue
21:53 the Pineapple Passionfruit
26:38 Cold Brew
29:07 Back-to-school-smiles.
30:02 Anytime protein
32:44 Footer notes
34:11 Visual adjustments
38:21 Results
38:45 Comparison
This video is prepared with educational and entertainment purposes only.

[@propersuspect2959]

one week ago I watched this and was like fuck it might try and learn coding (from a finance background) after about 20 hours of self learning this week I was able to watch this video and understand everything you were doing. Great Vid keep it up!

[@ServetGulnaroglu]

NICEE

[@nasiffuad292]

Best of Luck dude I am from Business Background And i can say if u r from finance then u can be a advance level expert in web dev

[@jasprvs.theworld5836]

what would you say are the perks of knowing coding with a business/finance background that you can use coding in daily deep work?

[@DaweedBeats]

any tips for a beginner? where to start learning?

[@propersuspect2959]

@@DaweedBeats honestly started with a free online 7 hour course with practice exercises worked super well also gave you the fundamentals from the beginning.

[@RandomDude_101]

I'm a web developer and it really relaxes me to watch you coding a website like this because I absolutely love CSS (and also I don't get frustrated with it when I'm watching this) EDIT: WOW I had no idea that there was gonna be so much people giving this a like

[@ServetGulnaroglu]

Glad you enjoy it!

[@m.naufalavila8792]

is it possible to coding a website with Lua?

[@RandomDude_101]

no, Lua is a language made for game development especially in roblox, the only languages supported for web development is HTML, CSS and Javascript

[@YSLBeezy]

@@RandomDude_101 you can also do web development in Python, C#, Java (Spring) and others.

[@RandomDude_101]

@@YSLBeezy I knew about py script but not c#

[@user-zc6eg5hu9m]

Oh i was studying HTML, and it's really cool to see someone write something with HTML (i'm russian and i'm only 14, so forgive me for my english😆)

[@ivan69420.]

что вы хотите узнать после того, как вы выучите html? (мне 11 лет)

[@user-zc6eg5hu9m]

@@ivan69420. Я пока забросила html, сейчас учу пайтон, так как это более перспективный язык и его можно довольно быстро выучить (хотя бы в общих чертах). Потом уже продолжу учить html и css.

[@vexy-_-1122]

@@ivan69420.I’m 9 😅 I already know python and c++

[@jeterplayzgaming6237]

@@vexy-_-1122well that nice keep going!

[@jeterplayzgaming6237]

Wow I’m 13 and I got HTML competition last year. I got at 18th of country. Keep going I know u can do better!

[@annie-mo1bm]

your videos have helped me to learn new things in programming, even though I'm at the beginning, with them I can guide and motivate myself to follow this path. this is special, thank you so much for that!

[@malo.mohamedaziz]

I'm a web developer and it really relaxes me to watch you coding

[@KINGABDUL99]

I watched this for 2 days and now I am, addicted keep up your Great videos❤❤

[@RebornVT]

Wow this is a great video! I took an intro course not too long ago and it's nice to see that I'm learning proper techniques and tools from my professor. Maybe I'll show him the box shadow generator because I LOVE any sort of time saving.

[@heroinedecheshire7065]

I just looove your keyboard sounds so much. Please never stop making coding video like these!

[@jayarman3972]

Even no talking, great to see some technique how you solve some problems like fitting the image, Also I like the generator css for shadow boxing

[@hyggedev2124]

Awesome job. This is why I love Tailwind though. No going back and forth between style sheet lol.

[@dtd6797]

감사합니당. 너무 도움되는 강의에요!

[@akashverma429]

i m from non IT background bcoz of some financial problems i have to switch in IT and i want to become a front end developer so i started from very basic HTML and CSS and believe me your videos are like motivation source for me. It inspire me and give me confidence that i can do it. Thanks a lot mate for uploading such a quality content.

[@lemonstrangler]

hi wanna work for my company. my company looking for trainees

[@burakbasduzen]

servet hocam gerçekten baştan sona videolarını izlersek eğer bir süre sonra ezberlemeye başlarız elimiz alışır. o yönden güzel olmuş bu tür videolar.

[@jonjuanbale]

Yo The Keyboard Sound is ASMR Dude.

[@san_murat_131]

Jesse! We need to code!

[@ankitnmnaik229]

What is ASMR?

[@Crunchiest]

@@ankitnmnaik229 Autonomous Sensory Meridian Response.

[@yukrix]

@@ankitnmnaik229 it’s short for awesomer

[@frankj9270]

Is that not the point of the video

[@KeepTheWalkShon]

Man this was so dope! I've been really trying to understand the layout of HTML And CSS its so different when actually seeing it in person 🤝 Awesome Content 💪

[@Ben-mv9xc]

This popped up in my recommended I never knew I needed that keyboard until now

[@Seedless_Mango]

It'd be super cool to see the key strokes you make because these shortcuts seem super helpful!

[@theauaccad670]

Yea like the one just after he paste the svg section for the navbar in the beginning. If someone knows how to do it write it down, thx!

[@briankeeley9488]

same and the way he was zipping around the html document without the mouse looked so satisfying.@@theauaccad670

[@yacineharouche4838]

​@@theauaccad670 select the svg and press alt + shift + F

[@ygjt76v0-----]

No music no smoking no coffe, absolutely legend 😂

[@Geloooooooooo]

No smoking?!

[@IMightyL]

@@Geloooooooooo how tf else you think we code bro lmfao

[@Geloooooooooo]

@@IMightyL no smoking

[@phensanji2501]

@@IMightyL no smoke

[@wevz.22]

@@IMightyL quit it

[@Nazadev]

I'm thirteen and KZbin recommends me many videos of html, js, etc. I watched this video like 1 week ago or 2 i don't remember and i was thinking if i was able to do this, so few days ago i started learning html and css and after 10 hours learning, i am able to understand everything of this vid. If u want to become a programmer, u just need confidence! Nice vid.

[@blackreaper4453]

You have the best videos about clone website

[@syoyamatsuda4579]

so so so good sounds!!

[@sandorpapp7057]

Professional as always!👍

[@mustafaatmaca1]

Bu tarz web site kodlama videolari cok yararli oluyor devamını bekliyoruz

[@onepubgm5995]

Exactly 10 days ago this would go just over my head And now this looks so much easier

[@kiinbaby8798]

How do u learn so fast bro help me please

[@shivak_]

Please share how you learn

[@gustavonovakoski4867]

@@kiinbaby8798 dude just search something like "online html css full course" maybe you can even find it free on youtube

[@csy897]

I probably wouldn't have been able to grind through and make it into switching jobs without vs code. I mean that html:5 snippet still makes me feel so grateful. Now I sometimes do a ctrl shift f on my browser and get instantly disappointed when it doesn't search all tabs. LOL

[@constantinadr8668]

Keep it up, you're very good at what you do👏

[@Mateji33]

Great sequence. Easy to follow up. Like it.

[@reagan574]

Got this same keyboard 2 weeks ago and loving it!

[@wildcatojerx1670]

what is the name of?

[@mr_frost65]

It's really good video and I can relax watching it. To be honest, I can't understand everything, because actually I learn python, but it's really cool to watch how professional works:)

[@StyLeImpLoSion]

EXACTLY WHAT I BEEN LOOKING FORRRR

[@couupakb9669]

Not sure if you will see this my friend but, I came across your channel about 3months ago randomly. I didn't even code and had no idea what all this text meant, I just loved the sounds of your keyboard and the clicks from your mouse. However, watching this had intrigued me more about code and I dove in to give it a try, I am now familiar with html and devoting alot of time to understand all the elements in css, when I first watched this I had no idea what most of it meant, but fast forward 3 months and I am grasping some of the things you are doing now and I just want to thank you, I have still a long journey on my coding path and I will see what the next 3 months shall bring. Thank you for igniting this passion I never would of discovered if I hadn't come across your channel.

[@twitterbizxxs2469]

quick question once he started the html file how come once he put "html:5" it wrote all that code for him but once I tried it nothing happened

[@diegorivera3345]

gonna be honest with you i love that keyboard its just soo great

[@thememedreamer9933]

This is the only asmr ill listen to

[@Richard-mh4pr]

Thank you for your teaching, it is very useful for me

[@nellyhernandez7087]

Love this!

[@Lorette_vlog]

So satisfying 😌

[@marcomarino2295]

Best way to learn something thank you

[@kimrholandguillem7527]

I learned more by watching you do this than learning from school for 2months 😑😑 they just go by the text book expect the student to self learn rather than showing them how to do it.

[@GingrWithNoE]

I had no idea how much I needed this. LMaooo

[@burak6759]

Creating websites is just so fun. Idk why. It’s addicting

[@janardannn]

just what i need after a hectic day

[@Mirko_ddd]

Great. I would have loved to see how you implement smaller screen sizes adjustments (mobile phone view).

[@sple3n788]

can you please please make at least just one video with explanation and to tell us everything about the shortcuts u use and all. I love your content and you made me to be more serious about learning web development. Thank you a lot, selam from Kosova.

[@Hyper_Futbuss]

Yeah dude!

[@tsenavi7389]

supersimpledev html css from beginner to pro, you're welcome

[@jayarman3972]

@@tsenavi7389 up to this, hopefully he make follow up js on it.

[@otherworld9936]

Great video i was planning to start learning JS but i changed my mind i think i should start with Html and css then learn JS and TS and maybe finish with Java.

[@codingasmr]

Nice design 👌

[@z3uS1927]

Thank you VERY MUCH ! Works like a charm 

[@pajmuasvwj]

I just wanna learn even more now- it looks so cool o.O

[@hanac5586]

Do it! There are a lot of great tutorials on youtube to learn basic html and css.

[@SpreadPeak]

I could learn you the basics in a small time for a small price, if you're interested, reach out.

[@saberahaque1333]

I subscribed you. And I'm still practicing your codes :)

[@kenthungbluthung6577]

thank you man, i love u

[@pigg3yy]

the gigachad keyboard and the generic af office mouse... love it this is a true programmer guys

[@norzvet]

That is your biggest work!? Its sooo coooool!

[@num.8063]

I LOVE THE KEYBORAD; COOL

[@ZeeshanElia]

Im big fan of yoursss 💗

[@mohamedahmedabd-alazim9239]

masterpiece

[@user-uq9qx6jd1z]

Good, Nice work guy! ❤

[@hensanglama9347]

imma try this ...great vid

[@ServetGulnaroglu]

Thank you!

[@pedro-6459]

Perfeição

[@user-nb2bf7np5g]

The type so good😊

[@vishwanath-ts]

Dude is a legend

[@nitta9892]

This makes me wanna practice more

[@mertbaturgurbuz5349]

Allah razı olsun abi şu videoyu görmem çok iyi oldu

[@paulsingh9298]

Hey question, where do you come up with these ideas to make these projects. Like a blueprint

[@salihliler]

Bu çok güzel bir konsept olmuş.

[@channelofredes2022]

hey i loved this! i wanted to be front-end programmer!

[@Akram_Wael]

That is nice ❤

[@catsarecute8669]

DAMN! THAT IS CRAZY!

[@hasannaqvi4056]

Like how you toggle to mobile and show the view earned a sub

[@creative_Idea693]

❤love your VDO post

[@Rodolfo3379]

Man I love your videos, I'm Brazilian, When you launch your courses, activate the subtitles in Portuguese.

[@searchezant3226]

Was waiting for the programming part

[@lane6373]

this is actually a funny comment

[@vishalmeena5943]

Keyboard sound 💗

[@zielaz3714]

This man just singlehandedly made a "How to make a phishing website" video and we are all on it. Jokes aside, great video, very relaxing.

[@tiskrok2957]

Finally something that works

[@sammytech9464]

Nice vid!

[@ard4lp]

46. Satirda padding degerlerini x ve y olarak dusunerek 4 tane girmek yerine 2 tane girebilirsin. Örneğin: padding: 5px 20px 5px 20px; = padding: 5px 20px; padding: 5px 5px 5px 5px; = padding: 5px; iki kullanimda ayni islevi goruyor.

[@Stl71]

English is the language of programming and informatics in general. Even if you say something important, no one is able to read it.

[@ard4lp]

@@Stl71 So, who is said I give him a “important info” drama girl?

[@Stl71]

@@ard4lp You have to practice your English boy. Just try harder.

[@scoticolin2298]

@@Stl71 nobody has to learn English, boy.

[@Stl71]

@@scoticolin2298 Do we know each other?

[@onisu3ka]

I love your content. ASMR is cool 😊

[@Metranam]

Good guide bro

[@dadaalexer9663]

just a quick question? how do you move the cursor without pressing the arrow keys? is that a shortcut?. just a newbie here. :)

[@yusufkemall]

Arkadaki Kalabak arabasi sesi :D Eline saglik

[@bandiero]

Dostum tasarımcı olarak kod öğrenmeye başladım, tebrik ederim!

[@reqssss]

Can you make a Visual Studio start-up tutorial, that would be great for your channel!

[@programmingchamins9744]

A Really Nice Video Dude :)

[@wesleyyabes9159]

the keyboard sound its very good

[@odyssey9707]

This is phenomenal, I wish I knew where to start with coding.

[@fedus22]

It's all on KZbin, just give it a shot! Search for beginner tutorials and start there. If you are interested in this area of websites learn HTML!

[@fedus22]

@@odyssey9707 Good luck and don't quit!

[@YeetYeetYe]

@@odyssey9707 How's it going so far?

[@SpreadPeak]

I could learn you the basics in a small time for a small price, if you're interested, reach out.

[@m.a.c.8544]

Great video! only one question, what metodology you use for the name of class in css? look very well. You hava a new subscriber. Greetings from a Venezuelan from Peru

[@sebeek00]

Hello, I honestly love your videos! It makes me relaxed and I learn new things. The questions is, what's the purpose of putting a HTML styling instead of CSS? Thank you!

[@ServetGulnaroglu]

There is no difference. However, if you have both css file and inline css, the inline css overrides the css file, if you try to customize the same attributes. I mean inline css has higher priority

[@noobtopro2108]

true asmr

[@robertjr8205]

I have no idea what the hell you’re doing but I hope to one day be able to do as good as this and look like I know what I’m doing.

[@NecheLifts]

I didn’t know either till i tried the tutorials on free codecamp on yt learn the basic syntax and Pattern and follow along and build project from vid and then build another one of what you memorize and google what u don’t understand that what most dev do and I do it do to fill in the knowledge gap

[@nmd9999]

This guy has built a static website with html and css not exactly hard is it 😂😂😂

[@ben-hn2ek]

@@NecheLifts yeah as time go u would automatically start understanding those gaps 🙂 another trick is google all the keywords in the part u don't understand it helps a lot too 🙂

[@drakata27]

Nice video bro. What keyboard are you using? Looks really cool!

[@irman8095]

I like how he started with hel (hello world) and then corrected it haha

[@Richard-mh4pr]

thanks my teacher

[@donizebua2217]

thank you for sharing your content, its really a good content and i like it so much.

[@aestheticzed]

eline sağlık bro

[@pro23-23]

Thanks

[@AndrewLewman]

I recommend you to try make your Caps Lock button as Escape button :3

[@pirate.96]

subbed on that spinning donut

[@enzoa7204]

Excelent 👏👏👏👏👏👏

[@studyingasyouwere]

Great video, Servet! Just curious, did your camera or your microphone die around 32:04??

[@GHOST-ob8jj]

these vids cheers g

[@gamoe]

thanks you