
src/portfolio.jsを変更して、個人のポートフォリオを取得するだけです。 src/_globalColor.scssファイルでグローバルに独自の配色を使用して、ポートフォリオテーマをカスタマイズします。そのまま使用するか、好きなだけパーソナライズしてください。
他のユーザーに貢献してこれをより良くしたい場合は、問題を見てください。
ポートフォリオのフォークのために素晴らしいものを作成し、それを共有したいですか?プルリクエストを自由に開いてください。
✔️概要と私について
✔✔️スキル
✔§教育
✔️仕事の経験
Githubに関連するオープンソースプロジェクト
✔️大きなプロジェクト
✔️成果と認定?
✔✔ブログ
✔唱。講演
podcast
✔️私に連絡してください
twitterタイムライン
Githubプロファイル
ライブの例を表示するには、ここをクリックしてください。
これらの指示により、プロジェクトのコピーを作成して、開発とテストの目的でローカルマシンで実行します。
git and 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
コマンドラインから、developerfolioをクローンして実行します:
# 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のピン留めアイテムのみを示しています。以下に示すように何かが表示されている場合は、これらの指示に従ってください。
上記のソリューションがまだ機能しない場合は、Wikiページにアクセスしてください。
オプションで、ブログのセクションを中程度のユーザーアカウントにリンクできます。
MEDIUM_USERNAMEを追加して、中程度のユーザー名を割り当てます// .env
MEDIUM_USERNAME = " YOUR MEDIUM USERNAME ".github/workflows/deploy.ymlの環境変数MEDIUM_USERNAME変更します。 Portofolio.jsでdisplayMediumBlogs trueまたはfalseに設定して、フェッチされた中程度のブログを表示しますが、デフォルトは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にアップロードし、 resume.pdfにPDFを変更してください。
絵文字を追加して? Portfolio.jsのテキストに、 emoji()関数を使用して、必要なテキストを引数として渡します。これは、さまざまなブラウザやプラットフォーム間で絵文字を互換性のあるものに保つのに役立ちます。
Lottieを選択して、このようなサイトからJSON形式でダウンロードできます。 src/assets/lottieで、同じファイル名で変更するLottie JSONファイルを交換します。 Lottieオプションを変更する場合は、 src/components/displayLottie/DisplayLottie.jsに移動し、 defaultOptionsオブジェクトを変更するには、 defaultOptionsオブジェクトの詳細についてはLottie-React Docsを参照できます。
portfolio.jsにTwitterのユーザー名を挿入して、ページに最近のアクティビティを表示します。
const twitterDetails = {
userName : "Your Twitter Username"
} ;注:ユーザー名を追加するときは@シンボルを使用しないでください。
セットアップが完了したら、オンラインでWebサイトをホストする必要があります。 githubページのドキュメントで展開することを反応することを強くお勧めします。
まず、使用するリポジトリのgithubアクションを有効にする必要があります。
GitHubからのプロファイルとリポジトリ情報は、展開時にのみ作成され、これらの情報を更新する必要がある場合は、サイトを再配置する必要があります。したがって、設定可能なCronジョブは毎週サイトを展開するセットアップであるため、GitHubでプロフィールを更新すると、ポートフォリオに表示されます。 workflow_dispatchイベントを使用して手動でトリガーすることもできます。その方法に関するこのガイドを参照してください。
このセクションでは、githubページにポートフォリオを展開するようにガイドします。
https://developerfolio.js.org/の代わりに、 package.jsonに移動し、 homepage変数でhttps://developerfolio.js.org/を入力します。たとえば、サイトをhttps://<your-username>.github.io/developerFolioにしたい場合は、 package.jsonのホームページセクションに同じものを追加します。
要するに、どちらもまったく同じであるため、 package.jsonに追加/devloperFolioを追加することもできます。そうすることで、 create-react-appそれに応じてパスアセットを追加するように指示します。
オプションで、ドメインを構成します。 public/ folderにCNAMEファイルを追加して、githubページでカスタムドメインを構成できます。
ここの公式CRAドキュメントからGitHubページをセットアップするガイドをフォローしてください。
独自のリポジトリをリンクすることにより、Netlifyを直接ホストすることもできます。
詳細については、Netlifyのホスティングをお読みください。
あなたがこれらで私たちを助けることができるなら。プルリクエストを開くことを躊躇しないでください。
LinkedInに接続して、要約、スキル、教育、経験を得る
ギャツビーに移動します
セクションを追加します
サードパスタ | Kartik Choudhary | Naveen MK | ムハンマド・ハサム |
これらの素晴らしい人々に感謝します(絵文字キー):
ファワド・アリ ? | Dasun Navoda | ブライアンティーマ | Rajkumar s | スリムコーダー | Mohamed Sayyaf | Ashutosh Hathidara |
リズワンジャマル⚡️ | ムハンマド・ハサム | ウジャワル・ジョシ | パラクセティ | Vinicius Barbosa | Bharat Kammakatla ? | ガリマシン |
ヘンリー・ヘン ? | Pulkit Banta ? | Akshay Kumar ? | Amna Ejaz ? | パラスナグパル | Sparsh Garg | Aashutosh Rathi |
Abhishek Kashyap ? | Lucas VC Nicolau | ブラッドリーC.ヘリン ? | Zekinah Lecaros | 気にしない | Arshad Ahmed | Xiaohui liu ? |
スンヨンリー | ナジャム・シェザド | ランディ・イエス・リアル・スルセン | タモジット・ダス | ワレン・ゴンザガ | ベンジャミン・ブルジョア | ケシェフ・ジャイン |
ハンツラ | Yogesh Rathod | クナル・ムンダダ | Anubhav Gupta | Vatsal Dave | エルビス・シュッフェテリ | スコット・ジェレン ? |
Karthik Mohan ? | mhowell11 | ガジャナンド ? | joohyukkim | 赤いヘッドフォン ? | スニット・ロイ ? | Atir Nayab ? |
シェリヤル・クレシ | 尊敬する | ブレイデン ? | Canciu Costin | アタルフシン | イシャン・カンデルワル | セルゲイ・リアプスティン |
カミラ・ポザス | サイ・テジャ ? | ヴィニット・ヘマドリ | Njong Emy | タマルダス | ダンシン | Muneeb Ahmed |
Qais attarwala |