developerFolio
Safe Release
ما عليك سوى تغيير src/portfolio.js للحصول على محفظتك الشخصية. تخصيص سمة محفظة باستخدام نظام الألوان الخاص بك على مستوى العالم في ملف src/_globalColor.scss . لا تتردد في استخدامه كما هو أو تخصيصه بقدر ما تريد.
إذا كنت ترغب في المساهمة وجعل هذا أفضل بكثير للمستخدمين الآخرين ، فقم بإلقاء نظرة على المشكلات.
خلقت شيء رائع لشوكة المحفظة الخاصة بك وتريد مشاركتها؟ لا تتردد في فتح طلب سحب.
✔ ملخص وحوالي
✔ المهارات
✔ التعليم
✔ تجربة العمل
✔ المشاريع المفتوحة المصدر متصلة بـ Github
✔ المشاريع الكبيرة
✔ الإنجازات والشهادات؟
✔ المدونات
محادثات
podcast
✔ اتصل بي
twitter الجدول الزمني Twitter
✔ github profile
لعرض مثال مباشر ، انقر هنا .
ستجلب لك هذه التعليمات نسخة من المشروع وتشغيلها على جهازك المحلي لأغراض التطوير والاختبار.
ستحتاج إلى GIT و Node.js (والتي تأتي مع NPM) مثبتة على جهاز الكمبيوتر الخاص بك أو استخدام Docker.
[email protected] or higher
[email protected] or higher
[email protected] or higher
1) BUILD IMAGE : docker build -t developerfolio:latest .
2) RUN IMAGE: docker run -t -p 3000:3000 developerfolio:latest
من سطر الأوامر الخاص بك ، استنساخ وتشغيل المطور:
# Clone this repository
git clone https://github.com/saadpasta/developerFolio.git
# Go into the repository
cd developerFolio
# Setup default environment variables
# For Linux
cp env.example .env
# For Windows
copy env.example .env
# Install dependencies
npm install
# Start a local dev server
npm startقم بإنشاء رمز الوصول الشخصي GitHub الكلاسيكي بعد هذه التعليمات (تأكد من عدم تحديد أي نطاق فقط إنشاء رمز بسيط). إذا كنت تستخدم إجراءات GitHub لنشر محفظتك ، فيمكنك تخطي هذا القسم.
ملاحظة: يوصى بشدة بتكوين متغيرات البيئة قبل نشر محفظتك لأن بعض المكونات تعتمد على بيانات API.
- DeveloperFolio
- node_modules
- public
- src
- .env < -- create it here
- env.example < -- this is the base file
- .gitignore
- package-lock.json
- package.jsonREACT_APP_GITHUB_TOKEN وتعيين رمز Github مثل هذا ، وأضف أيضًا اسم المستخدم الخاص بك كـ GITHUB_USERNAME // .env
REACT_APP_GITHUB_TOKEN = " YOUR GITHUB TOKEN HERE "
GITHUB_USERNAME = " YOUR GITHUB USERNAME "
USE_GITHUB_DATA = " true " قم بتعيين showGithubProfile إلى True أو False لإظهار ملف تعريف الاتصال باستخدام GitHub ، والافتراضات إلى False.
تحذير: تعامل مع الرموز المميزة مثل كلمات المرور والحفاظ عليها سرية. عند العمل مع API ، استخدم الرموز كمتغيرات بيئة بدلاً من ترميزها في برامجك.
ملاحظة: يعرض قسم مشاريع المصدر المفتوح فقط عناصر مثبتة من github. إذا كنت ترى شيئًا كما هو موضح أدناه ، فاتبع هذه التعليمات.
إذا كان الحل أعلاه لا يزال لا يعمل ، تفضل بزيارة صفحة ويكي.
اختياريا ، يمكنك ربط قسم المدونات بحساب المستخدم المتوسط الخاص بك:
MEDIUM_USERNAME وتعيين اسم المستخدم المتوسط الخاص بك // .env
MEDIUM_USERNAME = " YOUR MEDIUM USERNAME "MEDIUM_USERNAME في .github/workflows/deploy.yml قم بتعيين displayMediumBlogs على صواب أو خطأ في portofolio.js لعرض المدونات المتوسطة الجاهلة ، الافتراضية إلى True.
/src/portfolio.js وتعديله حسب حاجتك. ستحتاج أيضًا إلى تعديل index.html لتغيير العنوان والبيانات الوصفية لتوفير محركات البحث (SEO) الدقيقة لمحفظتك الشخصية. /* Change this file to get your Personal Porfolio */
const greeting = {
/* Your Summary And Greeting Section */
title : "Hi all I'm Saad" ,
subTitle : emoji ( "A passionate Full Stack Software Developer " ) ,
resumeLink : "https://drive.google.com/file/d/1ofFdKF_mqscH8WvXkSObnVvC9kK7Ldlu/view?usp=sharing"
} ;
const socialMediaLinks = {
/* Your Social Media Link */
github : "https://github.com/saadpasta" ,
linkedin : "https://www.linkedin.com/in/saadpasta/" ,
gmail : "[email protected]" ,
gitlab : "https://gitlab.com/saadpasta" ,
facebook : "https://www.facebook.com/saad.pasta7"
} ;
const skillsSection = { ... . }
const techStack = { ... . }
const workExperience = { ... . }
const openSource = { ... . }
const bigProjects = { ... . }
const achievementSection = { ... . }
const blogSection = { ... . }
const contactInfo = { ... . }
const twitterDetails = { ... } لتحميل سيرتك الذاتية الخاصة ، ما عليك سوى تحميل PDF إلى src/containers/greeting/resume وإعادة تسمية PDF إلى resume.pdf .
لإضافة الرموز التعبيرية؟ في النصوص في Portfolio.js ، استخدم وظيفة emoji() وتمرير النص الذي تحتاجه كوسيطة. هذا من شأنه أن يساعد في الحفاظ على رموز التعبيرية متوافقة عبر متصفحات ومنصات مختلفة.
يمكنك اختيار Littie وتنزيله بتنسيق JSON من مواقع مثل هذا. في src/assets/lottie ، استبدل ملف Lottie JSON الذي تريد تغييره بنفس اسم الملف. إذا كنت ترغب في تغيير خيارات Lottie ، فانتقل إلى src/components/displayLottie/DisplayLottie.js وتغيير كائن defaultOptions ، يمكنك الرجوع إلى مستندات React Lottie لمزيد من المعلومات حول كائن defaultOptions .
أدخل اسم مستخدم Twitter الخاص بك في portfolio.js لإظهار نشاطك الأخير على صفحتك.
const twitterDetails = {
userName : "Your Twitter Username"
} ; ملاحظة: لا تستخدم @ رمز عند إضافة اسم المستخدم.
عندما تنتهي من الإعداد ، يجب عليك استضافة موقع الويب الخاص بك عبر الإنترنت. نوصي بشدة بقراءة مستندات نشر صفحات github للرد.
أولاً ، يجب عليك تمكين إجراءات github للمستودع الذي تستخدمه.
يتم إنشاء ملف التعريف ومعلومات المستودع من Github فقط في وقت النشر ويجب إعادة نشر الموقع إذا كانت هذه المعلومات بحاجة إلى تحديث. لذلك ، يتم إعداد مهمة CRON القابلة للتكوين التي تنشر موقعك كل أسبوع ، بحيث بمجرد تحديث ملف التعريف الخاص بك على Github ، يتم عرضه على محفظتك. يمكنك أيضًا تشغيله يدويًا باستخدام حدث workflow_dispatch ، ومعرفة هذا الدليل حول كيفية القيام بذلك.
يوجهك هذا القسم إلى نشر محفظتك على صفحات GitHub.
انتقل إلى package.json وأدخل اسم المجال الخاص بك بدلاً من https://developerfolio.js.org/ في متغير homepage . على سبيل المثال ، إذا كنت تريد أن يكون موقعك https://<your-username>.github.io/developerFolio ، أضف نفسه إلى قسم الصفحة الرئيسية في package.json .
باختصار ، يمكنك أيضًا إضافة /devloperFolio إلى package.json لأن كلاهما هو نفسه تمامًا. عند القيام بذلك ، تخبر create-react-app لإضافة أصول المسار وفقًا لذلك.
اختياريا ، تكوين المجال. يمكنك تكوين مجال مخصص مع صفحات GitHub عن طريق إضافة ملف CNAME إلى public/ المجلد.
تابع دليل إعداد صفحات GitHub من مستندات CRA الرسمية هنا.
يمكنك أيضًا الاستضافة مباشرة مع NetLify عن طريق ربط مستودعك الخاص.
لمزيد من المعلومات ، اقرأ الاستضافة على NetLify.
إذا كنت تستطيع مساعدتنا في هذه. من فضلك لا تتردد في فتح طلب سحب.
تواصل مع LinkedIn للحصول على ملخص ومهارات والتعليم والخبرة
انتقل إلى غاتسبي
أضف المزيد من الأقسام
سعد المعكرونة | كارتيك تشودري | Naveen MK | محمد هاسهام |
شكراً لهؤلاء الأشخاص الرائعين (مفتاح الرموز التعبيرية):
فواد علي ؟ | داسون نافودا | براين تيمان | Rajkumar s | برمجة نحيفة | محمد سياف | أشوتوش هاثيدارا |
ريزوان جمال ⚡ | محمد هاسهام | Ujjawal جوشي | بالاك سيثي | فينيسيوس باربوسا | بهارات كاماكاتلا ؟ | غاريما سينغ |
هنري هنغ ؟ | بولكيت بانتا ؟ | أكشاي كومار ؟ | آما إيجاز ؟ | باراس ناجبال | Sparsh Garg | Aashutosh Rathi |
أبهيشيك كاشياب ؟ | لوكاس VC نيكولاو | برادلي سي هيرين ؟ | Zekinah Lecaros | هبوط | أرشاد أحمد | شياووي ليو ؟ |
Seungyeon-lee | نجام شهزاد | راندي يسوع ريال سرسين | Tamojit داس | وارين غونزاجا | بنيامين البرجوازية | كيشاف جاين |
حنزل | Yogesh Rathod | كونال موندادا | أنوبهاف غوبتا | vatsal ديف | إلفيس سيوفيتيلي | سكوت جيلن ؟ |
كارثيك موهان ؟ | Mhowell11 | جاجانانده ؟ | Joohyukkim | سماعة الرأس الأحمر ؟ | سونت روي ؟ | عتير ناياب ؟ |
شيريار قريشي | احترام | برايدن ؟ | Canciu Costin | أثارف سينغ | إيشان خاندلوال | سيرجي ليابوستن |
كاميلا بوزاس | ساي تيجا ؟ | فينيت هيمادري | نجونغ إيمي | تامال داس | Dunsin | مونيب أحمد |
Qais attarwala |
