Using mabuzant-resource skill to write the bilingual tech guide article.
مشروعك يصير موقع حقيقي بأمر واحد
الخطوة اللي تفصلك عن نشر مشروعك للعالم أقرب مما تتخيل
تخيل قاعد يومين تكتب كود على جهازك وشغال بس عندك، بس محد يقدر يشوفه غيرك. هذا الإحساس اللي يوقف أكثر الناس اللي يتعلمون البرمجة أو يجربون فكرة جديدة. بصراحة، أغلب المشاريع تموت على الجهاز الشخصي وما توصل لأحد. الخبر الزين إن في أدوات اليوم تاخذ مشروعك من مجلد على اللابتوب إلى رابط حقيقي يفتحه أي شخص، بأمر واحد بس في الطرفية (terminal).
🧩 إيش هو بالضبط
هذا يسمى النشر أو Deployment، يعني نقل مشروعك من جهازك الشخصي إلى سيرفر متصل بالإنترنت يشتغل طول الوقت. فكر فيه مثل معرض فنون. أنت رسمت اللوحة في الاستوديو الخاص فيك، بس محد يشوفها إلا لما تعلّقها في صالة عرض يزورها الناس. أدوات النشر الحديثة صارت هي صالة العرض الجاهزة اللي بس تحتاج توصّل لها.
⚙️ كيف يشتغل
لما تكتب أمر النشر، الأداة تسوي هذي الخطوات خلف الكواليس.
1️⃣ تقرأ ملفات مشروعك وتفهم نوعه، موقع بسيط أو تطبيق يحتاج سيرفر
2️⃣ ترفع الملفات إلى سيرفراتها وتجهز بيئة تشغيل مناسبة
3️⃣ تربط مشروعك برابط عام (URL) يقدر أي شخص يفتحه من أي جهاز
كل هذا يصير في ثواني، وأغلب الأدوات تعطيك الرابط مباشرة في نفس الطرفية.
🌍 وين تشوفه في حياتك
🚀 المشاريع الشخصية اللي تبي تشاركها بالسيرة الذاتية أو حساب لينكدإن
🛍️ متجر إلكتروني صغير جربته وتبي تشوف رد فعل الناس عليه
📱 نموذج أولي (prototype) لفكرة تطبيق قبل ما تعرضه على مستثمر
🎨 موقع بورتفوليو يعرض شغلك كمصمم أو مطور
🛠️ الأدوات اللي تستخدمها فعلاً
🔧 Vercel
منصة نشر معروفة بسرعتها وتركيزها على مشاريع React وNext.js، بس تشتغل مع أي موقع تقريباً.
كيف تبدأ فيها:
1️⃣ روح لموقع vercel.com وسوّي حساب مجاني بإيميلك أو حساب GitHub
2️⃣ افتح الطرفية داخل مجلد مشروعك واكتب npx vercel
3️⃣ اتبع الأسئلة اللي تطلع لك، وبعد ثواني بتحصل رابط مباشر لمشروعك
🔧 Netlify
خيار ممتاز للمواقع الثابتة والمشاريع اللي فيها HTML وCSS وJavaScript، وواجهتها سهلة جداً للمبتدئين.
كيف تبدأ فيها:
1️⃣ سوّي حساب مجاني على netlify.com
2️⃣ من داخل مجلد مشروعك بالطرفية اكتب npx netlify deploy
3️⃣ اختر مجلد الملفات اللي تبي تنشرها، وراح تحصل رابط تجريبي فوري
🔧 Railway
مناسب أكثر للمشاريع اللي تحتاج سيرفر شغال طول الوقت، مثل تطبيقات فيها قاعدة بيانات.
كيف تبدأ فيها:
1️⃣ سوّي حساب على railway.app واربطه بحساب GitHub
2️⃣ اختر مشروعك من القائمة واضغط زر Deploy
3️⃣ بعد دقيقة تقريباً بتشوف رابط مشروعك شغال ومباشر
🔧 Surge
أداة بسيطة جداً ومخصصة للمواقع الثابتة، ومثالية أول مرة تجرب فيها النشر.
كيف تبدأ فيها:
1️⃣ من الطرفية داخل مجلد مشروعك اكتب npx surge
2️⃣ اكتب إيميلك أول مرة عشان تسوي حساب سريع
3️⃣ بعد ثواني بتحصل رابط جاهز تقدر تشاركه فوراً
💡 جرّب بنفسك: خطوة بخطوة
خذ أي مشروع بسيط عندك الحين، حتى لو صفحة HTML وحدة أو تطبيق صغير.
1️⃣ افتح الطرفية وروح لمجلد المشروع باستخدام أمر cd
2️⃣ اكتب npx surge إذا كان مشروعك بسيط، أو npx vercel إذا كان فيه React
3️⃣ جاوب على الأسئلة البسيطة اللي بتطلع، أغلبها بس تأكيد بالضغط على Enter
4️⃣ راح تشوف رابط يطلع في الطرفية، افتحه في أي متصفح أو أرسله لصديق، وبكذا مشروعك صار حي على الإنترنت
وش تسوي بعد ذا
✅ جرب تنشر أبسط مشروع عندك اليوم حتى لو ناقص أو بسيط
✅ اقرا عن الفرق بين النشر الثابت (static) والنشر اللي يحتاج سيرفر
✅ اسأل نفسك، إيش أول شي بتنشره وتشارك رابطه مع الناس
مشروعك يستاهل يشوفه أحد غيرك، وما يبعدك عن ذا غير أمر واحد.
———— English ————
**One Command Puts Your Project Online**
The step that turns your local project into something anyone can open is closer than you think
Picture this. You spend two days building something on your laptop, it works perfectly, and only you can see it. That gap between it runs on my machine and anyone can open this link is what stops most beginners cold. Most side projects die quietly in a folder and never reach another person. The good part is that today's tools can take your project from a folder on your laptop to a real, shareable link with a single command typed into your terminal.
**What it actually is**
This is called deployment, the act of moving your project from your personal computer to a server that stays online and reachable by anyone. Think of it like an art studio versus a gallery. You paint the piece at home, but nobody sees it until it hangs somewhere people can walk in and look. Modern deployment tools are that gallery, already built and waiting, you just need to hand them your work.
**How it works**
When you run a deploy command, the tool quietly handles a few things behind the scenes.
1️⃣ It reads your project files and figures out what kind of project it is, a simple site or something that needs a running server
2️⃣ It uploads your files to its own servers and sets up the right environment to run them
3️⃣ It connects everything to a public URL that anyone, anywhere, can open in a browser
All of this usually takes seconds, and most tools print the live link right back into your terminal.
**Where you see it**
🚀 A personal project you want to link on your resume or LinkedIn profile
🛍️ A small online store you built and want real people to test
📱 A prototype of an app idea before you pitch it to anyone
🎨 A portfolio site showing off your design or development work
**🛠️ Tools you actually use**
🔧 Vercel
A deployment platform known for speed, built with React and Next.js projects in mind, though it handles most web projects well.
How to install or get started:
1️⃣ Go to vercel.com and create a free account using your email or GitHub
2️⃣ Open your terminal inside your project folder and type npx vercel
3️⃣ Answer the short prompts that appear, and within seconds you get a live link to your project
🔧 Netlify
A great option for static sites and simple HTML, CSS, and JavaScript projects, with one of the friendliest interfaces for beginners.
How to install or get started:
1️⃣ Create a free account at netlify.com
2️⃣ From your project folder in the terminal, type npx netlify deploy
3️⃣ Choose the folder you want to publish, and you get an instant preview link
🔧 Railway
Better suited for projects that need a server running continuously, like apps connected to a database.
How to install or get started:
1️⃣ Create an account at railway.app and connect it to your GitHub
2️⃣ Select your project from the list and click Deploy
3️⃣ Within a minute or so, your project is live at its own link
🔧 Surge
A very simple tool built for static sites, ideal the first time you try deploying anything.
How to install or get started:
1️⃣ From your terminal, inside your project folder, type npx surge
2️⃣ Enter your email the first time to create a quick account
3️⃣ Within seconds you get a link ready to share
**💡 Try it yourself: step by step**
Pick any small project you already have, even a single HTML page or a tiny app.
1️⃣ Open your terminal and navigate to your project folder using the cd command
2️⃣ Type npx surge if your project is simple, or npx vercel if it uses React
3️⃣ Answer the few prompts that appear, most of them just need you to press Enter
4️⃣ You will see a link printed in your terminal, open it in any browser or send it to a friend, and your project is now live on the internet
**What to do next**
✅ Deploy the simplest project you have today, even if it feels unfinished
✅ Read about the difference between static hosting and server based hosting
✅ Ask yourself which project you will deploy first and who you will send the link to
Your project deserves to be seen by someone other than you, and one command is all that stands in the way.