Responsive Blog App/Website with Admin Panel Tutorial - Full CRUD Blog App PHP & MySQL Project

Complete CRUD Blog Website with Admin Panel Tutorial for beginners - HTML CSS MySQL PHP Project Tutorial

In this practical (real-world) Project, we're going to build a complete CRUD (Create, Read, Update and Delete) Blog Website/Application using HTML, CSS, JavaScript, PHP, and MySQL.

This project is going to be in two parts. In this first video, we are going to design all the pages, of the blog website or application and make them responsive for the next video. The second video is going to be the backend using PHP & MySQL to make this whole application come to life.

Users will be able to read blogs, search blogs, sort blogs by categories, and more!
Users can also signup to become authors, where they can (add/edit/delete) their posts.
An Admin can do all an author can do, and more. An admin will be able to (add/edit/delete) users (admin/author), manage (add/edit/delete) categories.

Timestamps
00:00:05 Intro (Project Overview)
00:20:57 File/Folder Structure
00:26:04 Extensions
00:28:18 Nav HTML
00:32:40 Iconscout
00:35:35 CSS Variables
00:38:45 General CSS Styles
00:42:04 Google Font (montserrat)
00:49:40 Nav CSS
01:00:00 Featured Post HTML
01:09:45 General Post CSS
01:14:25 Featured Post CSS
01:16:37 Posts HTML
01:21:45 Posts CSS
01:24:50 Category Buttons HTML
01:26:50 Category Buttons CSS
01:30:00 Footer HTML & CSS
01:46:00 Media Queries (Medium Devices) Responsive Design
01:50:00 Nav Dropdown
01:58:05 Nav Toggle using JavaScript
02:04:00 Nav Dropdown Animation using CSS Keyframes
02:12:30 Media Queries (Small Devices) Responsive Design
02:17:30 Blog Page HTML
02:20:18 Blog Page CSS (Search Bar)
02:25:35 General Button CSS
02:29:20 Single Post Page HTML & CSS
02:40:20 Category Posts HTML & CSS
02:44:32 About, Services, Contact Page HTML & CSS
02:48:30 Sign Up Page HTML
02:54:30 General Form CSS
03:03:50 Sign in Page
03:05:20 Add Category Page
03:08:25 Add Post Page
03:14:35 Add User Page
03:18:20 Edit Category, Edit Post & Edit User Pages
03:24:00 Manage Categories Page
03:34:10 More Button CSS (sm, danger, success classes)
03:36:08 Dashboard CSS
03:46:00 Dashboard Media Queries (Responsive Design)
04:03:10 Manage Users Page
04:06:25 Manage Posts Page

#html #css #javascript

[Lmao-drbk]

I was waiting so hard today for the part two but it didn't come. I guess you have other stuff to do. Keep up the good work, your tutorial is extremely helpful and easy to follow! I really appreciate your effort!

[Funny-collector]

i think if you have an employer, , they are lucky to have you.you truly understand what you are doing you explain good and in detail, clean code without jumping any step, ,what am trying to say is that you are the best, ,hope you recover quickly as soon as possible.may God bless you and thank you for such great work❤️❤️love you, , i do really need backend ☺️☺️code.

[isaacmobe]

Finally the best developer in YouTube with another great video

[emmanuelamaechi]

Well done Charlie! I actually wondered if everything is ok. It's been 3 months since the last video
Welcome back, and quick recovery

[makazad]

You are great sir. All the parts are explained very well in the videos. I've completed the project successfully.
Thank you very much sir.

[ThePackAcademy]

Can’t wait for part 2, learned a lot already and i’m really curious about the backend! Thank you for your time and work!

[EloTec]

Muito obrigado!
Sou angolano 🇦🇴 e sigo o seu canal.
Na verdade, tenho aprendido bastante.
Muito obrigado!
Um forte abraço🫂 e continue produzindo bons conteúdos.

Ahh... não sei falar, nem escrever inglês 😅.
Por essa razão, estou escrevendo em português.

[Kevin_freeborn]

you are simply phenomenal. you explanations and everything. the most amazing thing is you don't skip anything even your mistakes which makes me love your content even more...

[mohommednimshan]

Very use full for beginners who studying HTML, CSS and javaScript

[Charles-nvgy]

Pls we so much need you.

I learn a lot from your teachings

[Insane._]

Thank you so much sir. This was an amazing tutorial for blog application 💥
Because of you, Now I'm pro at front-end. You're my guru thanks a lot sir.
Love you ❤‍🩹

[worldtoday]

I'll recommended your channel to whole my friends keep up the good work welcome back big bro

[vijayd]

it is really gives lots of confidence and satisfaction watching and replicating it .. will continue with part 2 as well, motivates alot. thx

[ilamiojike]

You are the best ever, please I really need the second video

[magedabdulaziz]

i really learned a lot from that thankk you a lot man and im going to part two to learn more about backend i really appriciate what are you doing and please do more full stack websites

[emirhanuluksar]

AWESOME VİDEO EGATOR WE ARE WAİTİNG FOR PART 2

[syedhaideralikazmi]

Thank you so much for providing such great tutorials. ❤️❤️

[funbrolk]

Bro, You are the best teacher of i met. Thank you for your all explanation part and it is very easy for understand for us♥️ i'm waiting for your backend part ♥️

[ashishkhatri]

Plzz make a tutorial for ecommerce website. Also tell me how would i know who has ordered what item in my ecommerce website. How would i connect my ecommerce website with my admin panel??

[kk]

Thanks a lot Egator! Because of you I've finished this beautiful project