
Changez simplement src/portfolio.js pour obtenir votre portefeuille personnel. Personnalisez le thème du portfolio en utilisant votre propre schéma de couleurs globalement dans le fichier src/_globalColor.scss . N'hésitez pas à l'utiliser tel quel ou à le personnaliser autant que vous le souhaitez.
Si vous souhaitez contribuer et rendre cela beaucoup meilleur pour les autres utilisateurs, consultez les problèmes.
Créé quelque chose de génial pour votre fourche du portefeuille et vous voulez le partager? N'hésitez pas à ouvrir une demande de traction.
✔️ Résumé et à propos de moi
✔️ Compétences
✔️ Education
✔️ Expérience de travail
✔️ Projets open source liés à GitHub
✔️ GRAND PROJETS
✔️ réalisations et certifications?
✔️ Blogs
✔️ Talks
✔️ Podcast
✔️ Contactez-moi
✔️ Calance de Twitter
✔️ Profil github
Pour voir un exemple en direct, cliquez ici .
Ces instructions vous procureront une copie du projet opérationnel sur votre machine locale à des fins de développement et de test.
Vous aurez besoin de Git et Node.js (qui sont livrés avec NPM) installés sur votre ordinateur ou utilisez 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
À partir de votre ligne de commande, clone et exécution de développeurfolio:
# 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 startGénérez un jeton d'accès personnel GitHub classique en suivant ces instructions (assurez-vous de ne pas sélectionner de portée généreuse simplement un jeton simple). Si vous utilisez des actions GitHub pour déployer votre portefeuille, vous pouvez ignorer cette section.
Remarque: La configuration des variables d'environnement avant le déploiement de votre portefeuille est fortement recommandée car certains composants dépendent des données de l'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 et affectez votre jeton github comme celui-ci, ajoutez également votre nom d'utilisateur sous le nom GITHUB_USERNAME // .env
REACT_APP_GITHUB_TOKEN = " YOUR GITHUB TOKEN HERE "
GITHUB_USERNAME = " YOUR GITHUB USERNAME "
USE_GITHUB_DATA = " true " Définissez showGithubProfile sur true ou false pour afficher le profil de contact à l'aide de GitHub, par défaut est faux.
AVERTISSEMENT: Traitez vos jetons comme des mots de passe et gardez-les secret. Lorsque vous travaillez avec l'API, utilisez les jetons comme variables d'environnement au lieu de les coder dur dans vos programmes.
Remarque: la section des projets open source affiche uniquement les éléments épinglés de votre github. Si vous voyez quelque chose comme indiqué ci-dessous, suivez ces instructions.
Si la solution ci-dessus ne fonctionne toujours pas, visitez la page Wiki.
Facultativement, vous pouvez lier la section des blogs à votre compte d'utilisateur moyen:
MEDIUM_USERNAME et attribuez votre nom d'utilisateur moyen // .env
MEDIUM_USERNAME = " YOUR MEDIUM USERNAME "MEDIUM_USERNAME dans .github/workflows/deploy.yml Définissez displayMediumBlogs sur True ou False dans Portofolio.js pour afficher les blogs moyens récupérés, par défaut.
/src/portfolio.js et modifiez-le selon vos besoins. Vous devrez également modifier index.html pour modifier le titre et les métadonnées pour fournir un référencement précis pour votre portefeuille personnel. /* 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 = { ... } Pour télécharger votre propre CV, téléchargez simplement un PDF sur src/containers/greeting/resume et renommez le PDF pour resume.pdf .
Pour ajouter des emoji? Dans les textes dans Portfolio.js , utilisez la fonction emoji() et passez le texte dont vous avez besoin comme argument. Cela aiderait à garder les emojis compatibles sur différents navigateurs et plateformes.
Vous pouvez choisir un lottie et le télécharger au format JSON à partir de sites comme celui-ci. Dans src/assets/lottie , remplacez le fichier Lottie JSON que vous souhaitez modifier par le même nom de fichier. Si vous souhaitez modifier les options Lottie, accédez à src/components/displayLottie/DisplayLottie.js et modifiez l'objet defaultOptions , vous pouvez référer des documents Lottie-React pour plus d'informations sur l'objet defaultOptions .
Insérez votre nom d'utilisateur Twitter dans portfolio.js pour afficher votre activité récente sur votre page.
const twitterDetails = {
userName : "Your Twitter Username"
} ; Remarque: N'utilisez pas @ symbole lors de l'ajout de nom d'utilisateur.
Lorsque vous avez terminé la configuration, vous devez héberger votre site Web en ligne. Nous vous recommandons fortement de lire le déploiement sur les documents GitHub Pages pour React.
Vous devez d'abord activer les actions GitHub pour le référentiel que vous utilisez.
Le profil et les informations du référentiel de GitHub ne sont créés qu'au moment du déploiement et le site doit être redéployé si ces informations doivent être mises à jour. Ainsi, un travail CRON configurable est configuré qui déploie votre site chaque semaine, de sorte qu'une fois que vous mettez à jour votre profil sur GitHub, il est affiché sur votre portefeuille. Vous pouvez également le déclencher manuellement à l'aide de l'événement workflow_dispatch , voir ce guide sur la façon de le faire.
Cette section vous guide pour déployer votre portefeuille sur les pages GitHub.
Accédez à package.json et entrez votre nom de domaine au lieu de https://developerfolio.js.org/ dans la variable homepage . Par exemple, si vous souhaitez que votre site soit https://<your-username>.github.io/developerFolio , ajoutez la même chose à la section de page d'accueil de package.json .
En bref, vous pouvez également ajouter /devloperFolio sur package.json car les deux sont exactement les mêmes. Ce faisant, vous dites create-react-app d'ajouter les actifs de chemin en conséquence.
Facultativement, configurez le domaine. Vous pouvez configurer un domaine personnalisé avec des pages GitHub en ajoutant un fichier CNAME au dossier public/ .
Suivez le guide pour configurer les pages GitHub des documents officiels de l'ARC ici.
Vous pouvez également héberger directement avec Netlify en reliant votre propre référentiel.
Pour plus d'informations, lisez l'hébergement sur Netlify.
Si vous pouvez nous aider avec ces derniers. N'hésitez pas à ouvrir une demande de traction.
Connectez-vous avec LinkedIn pour obtenir un résumé, des compétences, une éducation et une expérience
Déménager à Gatsby
Ajouter plus de sections
Pâtes saad | Kartik choudhary | Naveen Mk | Muhammad Hashham |
Merci à ces gens merveilleux (clé emoji):
Fawad Ali ? | Dasun Navoda | Brian Teeman | Rajkumar s | Codeur mince | Mohamed Sayyaf | Ashutosh Hathidara |
Rizwan Jamal ⚡️ | Muhammad Hashham | Ujjawal Joshi | Palak Sethi | Vinicius Barbosa | Bharat kammakatla ? | Garima Singh |
Henry Heng ? | Pulkit Banta ? | Akshay Kumar ? | Amna Ejaz ? | Paras nagpal | SPARSH GARG | Aashutosh Rathi |
Abhishek Kashyap ? | Lucas VC Nicolau | Bradley C. Herrin ? | Zekinah Lecaros | impatient | Arshad Ahmed | XiaoHUi Liu ? |
Seungyeon-Lee | Najam Shehzad | Randy Jésus Real Srsen | Tamojit das | Waren Gonzaga | Benjamin Bourgeois | Keshav Jain |
Hanzla | Yogesh Rathod | Kunal Mundada | Anubhav Gupta | Vatsal Dave | Elvis Ciuffelli | Scott Jellen ? |
Karthik Mohan ? | Mhowell11 | gajanandh ? | Joohyukkim | Casque rouge ? | Sunit Roy ? | Atir nayab ? |
Shehriyar Qureshi | RespectEchch | Brayden ? | Canciu costin | Atharv Singh | Ishan Khandelwal | Sergey Lyapustin |
Camila Pozas | Sai Teja ? | Vinit Hemadri | Njong emy | Tamal Das | Dunsin | Muneeb Ahmed |
Qais Attarwala |