developerFolio
Safe Release
개인 포트폴리오를 얻으려면 src/portfolio.js 변경하십시오. src/_globalColor.scss 파일에서 전 세계적으로 자신의 색 구성표를 사용하여 포트폴리오 테마를 사용자 정의하십시오. 당신이 원하는만큼 그것을 사용하거나 개인화하십시오.
다른 사용자에게 기여 하고 훨씬 더 나은 것을 만들고 싶다면 문제를 살펴보십시오.
포트폴리오 포크에 멋진 것을 만들어 공유하고 싶습니까? 풀 요청을 자유롭게 열십시오.
✔️ 요약 및 나에 대해
✔️ 기술
✔️ 교육
✔️ 직장 경험
Github와 연결된 오픈 소스 프로젝트
✔️ 큰 프로젝트
✔️ 성과 및 인증?
✔️ 블로그
✔️ 대화
✔️ 팟 캐스트
✔️ 저에게 연락하십시오
✔️ 트위터 타임 라인
✔️ github 프로파일
라이브 예를 보려면 여기를 클릭하십시오 .
이 지침을 통해 개발 및 테스트 목적으로 로컬 컴퓨터에서 프로젝트 사본을 실행할 수 있습니다.
컴퓨터에 설치되거나 Docker를 사용하는 Git 및 Node.js (NPM과 함께 제공)가 필요합니다.
[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를 사용하여 연락처 프로파일을 표시하고 기본값을 거짓으로 표시하십시오.
경고 : 토큰을 암호처럼 대우하고 비밀로 유지하십시오. API와 함께 작업 할 때는 토큰을 프로그램에 하드 코딩하는 대신 환경 변수로 사용하십시오.
참고 : 오픈 소스 프로젝트 섹션에는 GitHub의 고정 된 항목 만 표시됩니다. 아래에 표시된대로 무언가가 보이면 다음 지침을 따르십시오.
위의 솔루션이 여전히 작동하지 않으면 Wiki 페이지를 방문하십시오.
선택적으로 블로그 섹션을 중간 사용자 계정에 연결할 수 있습니다.
MEDIUM_USERNAME 추가하고 Medium 사용자 이름을 지정하십시오. // .env
MEDIUM_USERNAME = " YOUR MEDIUM USERNAME ".github/workflows/deploy.yml 에서 환경 변수 MEDIUM_USERNAME 변경하십시오. portofolio.js에서 displayMediumBlogs true 또는 false로 설정하여 메디컬 블로그를 표시하여 기본값을 표시합니다.
/src/portfolio.js 의 페이지 컨텐츠를 개인화하고 필요에 따라 수정하십시오. 또한 개인 포트폴리오에 정확한 SEO를 제공하기 위해 제목 및 메타 데이터를 변경하려면 index.html 수정해야합니다. /* 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() 함수를 사용하고 필요한 텍스트를 인수로 전달하십시오. 이는 이모티콘이 다른 브라우저와 플랫폼에서 호환성을 유지하는 데 도움이됩니다.
Lottie를 선택하고 이와 같은 사이트에서 JSON 형식으로 다운로드 할 수 있습니다. src/assets/lottie 에서 동일한 파일 이름으로 변경하려는 Lottie JSON 파일을 교체하십시오. Lottie 옵션을 변경하려면 src/components/displayLottie/DisplayLottie.js 로 이동하여 defaultOptions 객체를 변경하면 Lottie-React Docs를 참조하여 defaultOptions 개체에 대한 자세한 내용은 참조하십시오.
portfolio.js 에 Twitter 사용자 이름을 삽입하여 페이지에 최근 활동을 표시하십시오.
const twitterDetails = {
userName : "Your Twitter Username"
} ; 참고 : 사용자 이름을 추가 할 때 @ 기호를 사용하지 마십시오.
설정을 마치면 웹 사이트를 온라인으로 호스팅해야합니다. React 용 Github 페이지 문서의 배포를 읽는 것이 좋습니다.
먼저 사용하는 저장소에 대한 Github 조치를 활성화해야합니다.
GitHub의 프로필 및 저장소 정보는 배포 당시에 만 작성되며 해당 정보를 업데이트 해야하는 경우 사이트를 재배치해야합니다. 따라서 구성 가능한 CRON 작업은 매주 사이트를 배포하는 설정이므로 GitHub에서 프로필을 업데이트하면 포트폴리오에 표시됩니다. workflow_dispatch 이벤트를 사용하여 수동으로 트리거 할 수도 있습니다.이를 수행하는 방법에 대한이 안내서를 참조하십시오.
이 섹션에서는 GitHub 페이지에 포트폴리오를 배포하도록 안내합니다.
homepage 변수에서 package.json 으로 이동하여 https://developerfolio.js.org/ 대신 도메인 이름을 입력하십시오. 예를 들어, 귀하의 사이트가 https://<your-username>.github.io/developerFolio 되려면 package.json 의 홈페이지 섹션에 동일하게 추가하십시오.
요컨대, 둘 다 정확히 동일하므로 package.json 에 /devloperFolio 추가 할 수도 있습니다. 그렇게하면 create-react-app 통해 경로 자산을 그에 따라 추가합니다.
선택적으로 도메인을 구성하십시오. public/ 폴더에 CNAME 파일을 추가하여 GitHub 페이지로 사용자 정의 도메인을 구성 할 수 있습니다.
공식 CRA 문서에서 GitHub 페이지를 설정하려면 가이드를 따라 여기를 참조하십시오.
자신의 저장소를 연결하여 NetLify와 직접 호스팅 할 수도 있습니다.
자세한 내용은 NetLify에서 호스팅을 읽으십시오.
당신이 이것들로 우리를 도울 수 있다면. 주저하지 말고 풀 요청을 시작하십시오.
LinkedIn과 연결하여 요약, 기술, 교육 및 경험을 얻으십시오.
개츠비로 이사하십시오
더 많은 섹션을 추가하십시오
사드 파스타 | 카티 틱 choudhary | Naveen Mk | 무함마드 하햄 |
이 멋진 사람들에게 감사합니다 (이모티콘 키) :
Fawad Ali ? | Dasun Navoda | 브라이언 테먼 | Rajkumar s | 슬림 한 코더 | 모하메드 사야프 | Ashutosh Hathidara |
Rizwan Jamal an️ | 무함마드 하햄 | Ujjawal Joshi | 팔락 세티 | Vinicius Barbosa | Bharat Kammakatla ? | 가리마 싱 |
Henry Heng ? | 풀 키트 반타 ? | Akshay Kumar ? | Amna Ejaz ? | Paras Nagpal | Sparsh Garg | AASHUTOSH RATHI |
Abhishek Kashyap ? | 루카스 VC 니콜 라우 | 브래들리 C. 허린 ? | Zekinah Lecaros | 무패 | Arshad Ahmed | Xiaohui Liu ? |
Seungyeon-Lee | Najam Shehzad | 랜디 예수 진짜 Srsen | Tamojit Das | Waren Gonzaga | 벤자민 부르주아 | 케샤 브자인 |
한즐라 | Yogesh Rathod | Kunal Mundada | anubhav gupta | Vatsal Dave | Elvis Ciuffetelli | 스콧 젤렌 ? |
Karthik Mohan ? | Mhowell11 | Gajanandh ? | 주 히크 킴 | 빨간 헤드폰 ? | Sunit Roy ? | Atir Nayab ? |
Shehriyar Qureshi | 존중 | 브레이덴 ? | Canciu Costin | Atharv Singh | Ishan Khandelwal | Sergey Lyapustin |
카밀라 포자 | 사이 테자 ? | Vinit Hemadri | Njong Emy | Tamal Das | 던신 | Muneeb Ahmed |
Qais Attarwala |
