Web Development
75.1K subscribers
1.29K photos
1 video
2 files
579 links
Learn Web Development From Scratch

0️⃣ HTML / CSS
1️⃣ JavaScript
2️⃣ React / Vue / Angular
3️⃣ Node.js / Express
4️⃣ REST API
5️⃣ SQL / NoSQL Databases
6️⃣ UI / UX Design
7️⃣ Git / GitHub

Admin: @love_data
Download Telegram
🔰 What Is MERN?

MERN Stack is a Javascript Stack that is used for easier and faster deployment of full-stack web applications. MERN Stack comprises of 4 technologies namely: MongoDB, Express, React and Node.js. It is designed to make the development process smoother and easier.

🔰 MongoDB:

MongoDb is a NoSQL DBMS where data is stored in the form of documents having key-value pairs similar to JSON objects. MongoDB enables users to create databases, schemas and tables.

🔰 ExpressJS

ExpressJS is a NodeJS framework that simplifies writing the backend code. It saves you from creating multiple Node modules.

🔰 ReactJS

ReactJS is a JS library that allows the development of user interfaces for mobile apps and SPAs. It allows you to code Javascript and develop UI components.

🔰 NodeJS

NodeJS is an open-source Javascript runtime environment that allows users to run code on the server.

Mernstack for Web Developers: https://whatsapp.com/channel/0029Vaxox5i5fM5givkwsH0A

Enjoy Learning 😄
6
Use this method to practice your front-end skills or learn a new framework like React or Vue🔥:

1. Google "public API's"
2. Pick any topic you like
3. Fetch some data from the API
4. Display the data in a simple UI

This will teach you a lot of fundamental skills like communicating with an external data source, handling loading/error states, and building intuitive user interfaces.

It'll also be more fun and motivating if you pick a topic you're personally interested in (books, movies, crypto etc.)

And of course you don't need to stop there - feel free to add any features you like. But now you have a solid starting point to work off of.
2
But if you can manage to learn:

1. The fundamental tools of the web (HTML, CSS, JavaScript + git)
2. Frameworks and metaframeworks like Tailwind, React / Vue and NextJS / NuxtJS
3. Soft skills like a great attitude, positive energy, honesty and great communication skills

Then you have what it takes to land that first front-end job.

And remember: You don't need to be an expert in all of these technologies. But having a basic understanding of how they all work together goes a long way.
6
SQL beginner to advanced level
8
CSS Cheat Sheet
12👍5🥰1
Which command stages all modified and new files for commit?
Anonymous Quiz
44%
A) git commit -m "message"
11%
B) git push
41%
C) git add .
5%
D) git pull
4
Which command uploads your local commits to the remote repository?
Anonymous Quiz
8%
a) git pull
79%
b) git push
9%
c) git merge
5%
d) git fetch
4
How do you create and switch to a new branch named “feature”?
Anonymous Quiz
17%
a) git branch feature
19%
b) git checkout feature
47%
c) git checkout -b feature
17%
d) git new branch feature
5
Which command shows you the commit history?
Anonymous Quiz
28%
a) git history
36%
b) git log
30%
c) git status
6%
d) git track
3
Which command fetches and merges changes from the remote main branch into your local main?
Anonymous Quiz
34%
a) git merge origin main
42%
b) git pull origin main
13%
c) git fetch main
11%
d) git pull main origin
7
Here are 20 essential VS Code shortcuts for beginners:

1. Ctrl + P: Open any file quickly 📂

2. Ctrl + /: Toggle line comment 📝

3. Alt + Up/Down: Move a line up or down ↕️

4. Ctrl + Shift + K: Delete the current line

5. Ctrl + B: Show/hide the sidebar 📚

6. Ctrl + Space: Trigger IntelliSense for code suggestions 💡

7. Ctrl + Shift + F: Search across files 🔍

8. Ctrl + D: Select the next occurrence of the selected text 📑

9. Ctrl + Shift + L: Select all occurrences of the current selection 🔗

10. Ctrl + Shift + P: Open the Command Palette 📜

11. Ctrl + F2: Rename all occurrences of a variable ✏️

12. Ctrl + J: Show/hide the integrated terminal 💻

13. Ctrl + `: Open a new terminal 🔧

14. Ctrl + Shift + N: Open a new window 🖼️

15. Ctrl + W: Close the current editor tab 🗂️

16. Ctrl + Shift + E: Focus on the file explorer 🗃️

17. Ctrl + Shift + G: Open the Git view 🔄

18. Ctrl + Shift + M: Open the Problems panel 🚨

19. Alt + Shift + Up/Down: Copy the line up or down 📋

20. Ctrl + Alt + Arrow keys: Split the editor window ✂️


Master these and level up your coding speed! 🚀
8