├── .eslintignore ├── .eslintrc.js ├── .github ├── ISSUE_TEMPLATE │ ├── bug-report.md │ └── feature-enhancement-request.md └── workflows │ └── main.yml ├── .gitignore ├── .prettierignore ├── .prettierrc.js ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── gatsby-browser.js ├── gatsby-config.js ├── gatsby-node.js ├── gatsby-ssr.js ├── netlify.toml ├── package-lock.json ├── package.json ├── src ├── components │ ├── Field │ │ ├── BlogPostField.tsx │ │ ├── GithubReadmeStatsField.tsx │ │ ├── ImageField.tsx │ │ ├── ProfileVisitorCounterField.tsx │ │ ├── SkillsField.tsx │ │ ├── SocialField.tsx │ │ ├── SpotifyListeningTo.tsx │ │ ├── SupportMeToField.tsx │ │ ├── TextField.tsx │ │ └── index.tsx │ ├── Preview.tsx │ ├── Section.tsx │ └── Sidebar.tsx ├── config │ ├── global.ts │ ├── skills.ts │ ├── social.ts │ └── templates │ │ ├── index.ts │ │ ├── template-1.ts │ │ └── template-2.ts ├── context │ └── GlobalContextProvider.tsx ├── fonts │ └── archia-regular-webfont.woff ├── images │ ├── bonjour.jpg │ ├── ciao.jpg │ ├── demo.gif │ ├── gatsby-icon.png │ ├── greetings.gif │ ├── hello.jpg │ ├── hola.jpg │ ├── logo.png │ ├── namaste.jpg │ └── nihao.jpg ├── pages │ ├── 404.tsx │ └── index.tsx ├── styles │ ├── fields.module.scss │ ├── global.scss │ ├── index.module.scss │ ├── preview.module.scss │ └── sidebar.module.scss └── types │ └── scss.d.ts ├── static ├── archia-regular-webfont-571e46710904236b3eb8a4212d62d49d.woff └── skills-assets │ ├── adobe_illustrator-icon.svg │ ├── adobedreamweaver.png │ ├── adobeindesign.svg │ ├── adobepremierepro.png │ ├── adobexd.png │ ├── aftereffects.png │ ├── amazonwebservices-original-wordmark.svg │ ├── android-original-wordmark.svg │ ├── angularjs-original.svg │ ├── ansible.png │ ├── apache_cassandra-icon.svg │ ├── apache_hadoop-icon.svg │ ├── apache_kafka-icon.svg │ ├── apache_solr-icon.svg │ ├── arduino.png │ ├── astro.svg │ ├── backbonejs-original-wordmark.svg │ ├── bem.svg │ ├── blender_community_badge_white.svg │ ├── bootstrap-plain.svg │ ├── c-original.svg │ ├── capacitor.svg │ ├── chai.png │ ├── chakraui.png │ ├── codeigniter.svg │ ├── cordova.png │ ├── cplusplus-original.svg │ ├── csharp-original.svg │ ├── css3-original-wordmark.svg │ ├── cython-original.svg │ ├── d3.png │ ├── d3js-original.svg │ ├── dartlang-icon.svg │ ├── deno.svg │ ├── django-original.svg │ ├── docker-original-wordmark.svg │ ├── dot-net-original-wordmark.svg │ ├── dotnetcore.png │ ├── elasticsearch.png │ ├── electron-original.svg │ ├── express-original-wordmark.svg │ ├── figma-icon.svg │ ├── firebase.png │ ├── flask.png │ ├── flutterio-icon.svg │ ├── gatsby.png │ ├── git-scm-icon.svg │ ├── gitlab.svg │ ├── gnu_bash-icon.svg │ ├── go-original.svg │ ├── google_cloud-icon.svg │ ├── grafana.png │ ├── graphql.png │ ├── gulp-plain.svg │ ├── haskell.png │ ├── html5-original-wordmark.svg │ ├── influxdb.svg │ ├── invision.svg │ ├── ionic.svg │ ├── java-original-wordmark.svg │ ├── javascript-original.svg │ ├── jenkins-icon.svg │ ├── jest.svg │ ├── jquery.png │ ├── keras.png │ ├── kibana.png │ ├── kotlinlang-icon.svg │ ├── kubernetes-icon.svg │ ├── laravel-plain-wordmark.svg │ ├── latex.png │ ├── lightroom.png │ ├── linux-original.svg │ ├── logo-title.svg │ ├── mariadb.png │ ├── meteor.svg │ ├── microsoft_azure-icon.svg │ ├── mocha.png │ ├── mongodb-original-wordmark.svg │ ├── mui.png │ ├── mysql-original-wordmark.svg │ ├── nativescript.png │ ├── nestjs.svg │ ├── nextjs.png │ ├── nginx-original.svg │ ├── nodejs-original-wordmark.svg │ ├── nuxt.png │ ├── opencv-icon.svg │ ├── openstack.png │ ├── openui5.svg │ ├── oracle-original.svg │ ├── photoshop-plain.svg │ ├── php-original.svg │ ├── postgresql-original-wordmark.svg │ ├── powerbi.jpg │ ├── powerbi.png │ ├── powershell.png │ ├── prisma.png │ ├── python-original.svg │ ├── pytorch-icon.svg │ ├── r.svg │ ├── rabbitmq-icon.svg │ ├── rails-original-wordmark.svg │ ├── raspberrypi.png │ ├── react-original-wordmark.svg │ ├── redis-original-wordmark.svg │ ├── redux-original.svg │ ├── ruby-original-wordmark.svg │ ├── rust-plain.svg │ ├── salesforce.png │ ├── sass-original.svg │ ├── scala-original-wordmark.svg │ ├── springio-icon.svg │ ├── strapi.svg │ ├── styled-components.png │ ├── swift-original-wordmark.svg │ ├── symfony_black_03.svg │ ├── tableau.svg │ ├── tailwindcss.svg │ ├── tensorflow-icon.svg │ ├── terraformio-icon.svg │ ├── typescript-original.svg │ ├── unity.png │ ├── vuejs-original-wordmark.svg │ ├── webpack-original.svg │ ├── windicss.svg │ ├── woocommerce.png │ ├── wordpress.png │ ├── xaml.png │ └── xampp.png └── tsconfig.json /.eslintignore: -------------------------------------------------------------------------------- 1 | .cache 2 | public 3 | node_modules 4 | dist -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | parser: '@typescript-eslint/parser', // Specifies the ESLint parser 3 | parserOptions: { 4 | ecmaVersion: 2020, // Allows for the parsing of modern ECMAScript featu$ 5 | sourceType: 'module', // Allows for the use of imports 6 | ecmaFeatures: { 7 | jsx: true, // Allows for the parsing of JSX 8 | tsx: true, // Allows for the parsing of JSX 9 | }, 10 | }, 11 | settings: { 12 | react: { 13 | version: 'detect', // Tells eslint-plugin-react to automatically de$ 14 | }, 15 | }, 16 | extends: [ 17 | 'plugin:react/recommended', // Uses the recommended rules from @eslint-$ 18 | 'plugin:@typescript-eslint/recommended', // Uses the recommended rules $ 19 | 'prettier/@typescript-eslint', // Uses eslint-config-prettier to disabl$ 20 | 'plugin:prettier/recommended', // Enables eslint-plugin-prettier and es$ 21 | ], 22 | plugins: ['react-hooks'], 23 | rules: { 24 | // Place to specify ESLint rules. Can be used to overwrite rules specif$ 25 | // e.g. "@typescript-eslint/explicit-function-return-type": "off", 26 | '@typescript-eslint/no-empty-function': 'off', 27 | }, 28 | }; 29 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug-report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Bug report 3 | about: Create a report to help us improve 4 | title: '' 5 | labels: bug 6 | assignees: '' 7 | --- 8 | 9 | **Describe the bug** 10 | A clear and concise description of what the bug is. 11 | 12 | **To Reproduce** 13 | Steps to reproduce the behavior: 14 | 15 | 1. Go to '...' 16 | 2. Click on '....' 17 | 3. Scroll down to '....' 18 | 4. See error 19 | 20 | **Expected behavior** 21 | A clear and concise description of what you expected to happen. 22 | 23 | **Screenshots** 24 | If applicable, add screenshots to help explain your problem. 25 | 26 | **Desktop (please complete the following information):** 27 | 28 | - OS: [e.g. iOS] 29 | - Browser [e.g. chrome, safari] 30 | - Version [e.g. 22] 31 | 32 | **Smartphone (please complete the following information):** 33 | 34 | - Device: [e.g. iPhone6] 35 | - OS: [e.g. iOS8.1] 36 | - Browser [e.g. stock browser, safari] 37 | - Version [e.g. 22] 38 | 39 | **Additional context** 40 | Add any other context about the problem here. 41 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature-enhancement-request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Feature/Enhancement request 3 | about: Suggest an idea for this project 4 | title: '' 5 | labels: enhancement 6 | assignees: '' 7 | --- 8 | 9 | **Is your feature request related to a problem? Please describe.** 10 | A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] 11 | 12 | **Describe the solution you'd like** 13 | A clear and concise description of what you want to happen. 14 | 15 | **Describe alternatives you've considered** 16 | A clear and concise description of any alternative solutions or features you've considered. 17 | 18 | **Additional context** 19 | Add any other context or screenshots about the feature request here. 20 | -------------------------------------------------------------------------------- /.github/workflows/main.yml: -------------------------------------------------------------------------------- 1 | # This is a basic workflow to help you get started with Actions 2 | 3 | name: CI 4 | 5 | # Controls when the action will run. Triggers the workflow on push or pull request 6 | # events but only for the master branch 7 | on: 8 | push: 9 | branches: [master, dev] 10 | pull_request: 11 | types: [opened, opened, synchronize, reopened] 12 | branches: [master, dev] 13 | 14 | # A workflow run is made up of one or more jobs that can run sequentially or in parallel 15 | jobs: 16 | # This workflow contains a single job called "build" 17 | build: 18 | # The type of runner that the job will run on 19 | runs-on: ubuntu-latest 20 | 21 | strategy: 22 | matrix: 23 | node-version: [14.x] 24 | 25 | # Steps represent a sequence of tasks that will be executed as part of the job 26 | steps: 27 | # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it 28 | - uses: actions/checkout@v3 29 | 30 | - uses: actions/setup-node@v3 31 | with: 32 | node-version: ${{ matrix.node-version }} 33 | cache: 'npm' 34 | 35 | - name: Print versions 36 | run: npm run info 37 | 38 | - name: Install dependencies 39 | run: npm i 40 | 41 | - name: Run linter 42 | run: npm run lint 43 | 44 | - name: Build 45 | run: npm run build 46 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | 2 | # Created by https://www.gitignore.io/api/node,react,linux,macos,windows 3 | # Edit at https://www.gitignore.io/?templates=node,react,linux,macos,windows 4 | 5 | ### Linux ### 6 | *~ 7 | 8 | # temporary files which can be created if a process still has a handle open of a deleted file 9 | .fuse_hidden* 10 | 11 | # KDE directory preferences 12 | .directory 13 | 14 | # Linux trash folder which might appear on any partition or disk 15 | .Trash-* 16 | 17 | # .nfs files are created when an open file is removed but is still being accessed 18 | .nfs* 19 | 20 | ### macOS ### 21 | # General 22 | .DS_Store 23 | .AppleDouble 24 | .LSOverride 25 | 26 | # Icon must end with two \r 27 | Icon 28 | 29 | # Thumbnails 30 | ._* 31 | 32 | # Files that might appear in the root of a volume 33 | .DocumentRevisions-V100 34 | .fseventsd 35 | .Spotlight-V100 36 | .TemporaryItems 37 | .Trashes 38 | .VolumeIcon.icns 39 | .com.apple.timemachine.donotpresent 40 | 41 | # Directories potentially created on remote AFP share 42 | .AppleDB 43 | .AppleDesktop 44 | Network Trash Folder 45 | Temporary Items 46 | .apdisk 47 | 48 | ### Node ### 49 | # Logs 50 | logs 51 | *.log 52 | npm-debug.log* 53 | yarn-debug.log* 54 | yarn-error.log* 55 | lerna-debug.log* 56 | 57 | # Diagnostic reports (https://nodejs.org/api/report.html) 58 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 59 | 60 | # Runtime data 61 | pids 62 | *.pid 63 | *.seed 64 | *.pid.lock 65 | 66 | # Directory for instrumented libs generated by jscoverage/JSCover 67 | lib-cov 68 | 69 | # Coverage directory used by tools like istanbul 70 | coverage 71 | *.lcov 72 | 73 | # nyc test coverage 74 | .nyc_output 75 | 76 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 77 | .grunt 78 | 79 | # Bower dependency directory (https://bower.io/) 80 | bower_components 81 | 82 | # node-waf configuration 83 | .lock-wscript 84 | 85 | # Compiled binary addons (https://nodejs.org/api/addons.html) 86 | build/Release 87 | 88 | # Dependency directories 89 | node_modules/ 90 | jspm_packages/ 91 | 92 | # TypeScript v1 declaration files 93 | typings/ 94 | 95 | # TypeScript cache 96 | *.tsbuildinfo 97 | 98 | # Optional npm cache directory 99 | .npm 100 | 101 | # Optional eslint cache 102 | .eslintcache 103 | 104 | # Optional REPL history 105 | .node_repl_history 106 | 107 | # Output of 'npm pack' 108 | *.tgz 109 | 110 | # Yarn Integrity file 111 | .yarn-integrity 112 | 113 | # dotenv environment variables file 114 | .env 115 | .env.test 116 | 117 | # parcel-bundler cache (https://parceljs.org/) 118 | .cache 119 | 120 | # next.js build output 121 | .next 122 | 123 | # nuxt.js build output 124 | .nuxt 125 | 126 | # rollup.js default build output 127 | dist/ 128 | 129 | # Uncomment the public line if your project uses Gatsby 130 | # https://nextjs.org/blog/next-9-1#public-directory-support 131 | # https://create-react-app.dev/docs/using-the-public-folder/#docsNav 132 | public 133 | 134 | # Storybook build outputs 135 | .out 136 | .storybook-out 137 | 138 | # vuepress build output 139 | .vuepress/dist 140 | 141 | # Serverless directories 142 | .serverless/ 143 | 144 | # FuseBox cache 145 | .fusebox/ 146 | 147 | # DynamoDB Local files 148 | .dynamodb/ 149 | 150 | # Temporary folders 151 | tmp/ 152 | temp/ 153 | 154 | ### react ### 155 | .DS_* 156 | **/*.backup.* 157 | **/*.back.* 158 | 159 | node_modules 160 | 161 | *.sublime* 162 | 163 | psd 164 | thumb 165 | sketch 166 | 167 | ### Windows ### 168 | # Windows thumbnail cache files 169 | Thumbs.db 170 | Thumbs.db:encryptable 171 | ehthumbs.db 172 | ehthumbs_vista.db 173 | 174 | # Dump file 175 | *.stackdump 176 | 177 | # Folder config file 178 | [Dd]esktop.ini 179 | 180 | # Recycle Bin used on file shares 181 | $RECYCLE.BIN/ 182 | 183 | # Windows Installer files 184 | *.cab 185 | *.msi 186 | *.msix 187 | *.msm 188 | *.msp 189 | 190 | # Windows shortcuts 191 | *.lnk 192 | 193 | # End of https://www.gitignore.io/api/node,react,linux,macos,windows -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | .cache 2 | package.json 3 | package-lock.json 4 | public -------------------------------------------------------------------------------- /.prettierrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | semi: true, 3 | trailingComma: 'all', 4 | singleQuote: true, 5 | printWidth: 120, 6 | tabWidth: 4, 7 | arrowParens: 'avoid', 8 | }; 9 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contribution Guidelines 2 | 3 | ## Branching System 4 | 5 | We have two branches: 6 | 7 | 1. `master`: for production accessible via [http://profilinator.rishav.dev/](http://profilinator.rishav.dev/) 8 | 2. `dev`: for development and testing accessible via [https://dev-profilinator.rishav.dev/](https://dev-profilinator.rishav.dev/) 9 | 10 | Pull requests are the best way to propose changes. We actively welcome your pull requests: 11 | 12 | 1. Create an issue 13 | 2. Fork the repo and create your branch from `dev`. 14 | 3. Make changes to code or documentation 15 | 4. Commit changes 16 | 5. Squash commits solving a single issue 17 | 6. Rebase from upstream `dev` branch 18 | 7. Push commits 19 | 8. Create a new PR to `dev` branch 20 | 9. Link your PR to the issue 21 | 22 | ## Adding new readme templates 23 | 24 | 1. Visit the Profilinator 25 | 2. Click the `Start Fresh` button and create your new template from scratch 26 | 3. Strictly use data from `template-1.ts` and `template-2.ts` for your new template 27 | 4. If you need to add image, add under the `/static` directory 28 | 5. Once done, click on the `Generate README.md` button. This will output the template config in the console 29 | 6. Copy the config and create a template file under `/src/config/templates` with the name `template-[next-index].ts` 30 | 7. Include the new config in `/src/config/templates/index.ts` 31 | 8. Add the new config in `/src/components/Section.tsx` in the `templateMenu` function 32 | 33 | ## Check builds locally before pushing 34 | 35 | 1. `npm run lint` 36 | 2. `npm run build` 37 | 38 | ## Examples for adding a new field 39 | 40 | 1. [Added Spotify field](https://github.com/rishavanand/github-profilinator/pull/15) 41 | 2. [Added Support me field](https://github.com/rishavanand/github-profilinator/pull/44) 42 | 43 | Happy Contributing! :D 44 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 gatsbyjs 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |
2 | 3 | 4 | 5 | # Github Profilinator 6 | 7 | Generate creative GitHub profile readmes in few click! 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 |
21 | 22 | View Generator · View Generated Profile · Report Bug · Request Feature 23 | 24 | _Loved the project? Show your love to the developer by starring this repo._ 25 | 26 |
27 | 28 | 29 | 30 |
31 | 32 | --- 33 | 34 | This project is aimed to simplify your GitHub profile generation process by providing creative components from all over the web which can be added in a few click. In the end, with the click of a button, markdown is auto-generated which you can directly add to your readmes. 35 | 36 | --- 37 | 38 | ## 🧐 Feature list 39 | 40 | - [x] Image and text fields have multiple options like alignment, sizes, fit to screen 41 | - [x] Skill set filed 42 | - [x] Social badges field 43 | - [x] GitHub activity and language stats 44 | - [x] Dynamic blog posts 45 | - [x] Visitor counter 46 | - [x] Init with demo template 47 | - [x] Multi column support 48 | - [x] Customizable blocks and layouts 49 | - [x] Listening to from Spotify 50 | - [x] Multi template 51 | - [ ] Last tweet from Twitter 52 | - [ ] Last 3 uploads from Instagram 53 | 54 | ## 🚀 Getting started 55 | 56 | This project is already deployed on https://profilinator.rishav.dev 57 | 58 | Instructions for local deployment are given below: 59 | 60 | 1. Clone the repository 61 | 62 | ``` 63 | git clone git@github.com:rishavanand/github-profilinator.git 64 | ``` 65 | 66 | 2. Enter the project directory 67 | 68 | ``` 69 | cd github-profilinator 70 | ``` 71 | 72 | 3. Install dependencies 73 | 74 | ``` 75 | npm i 76 | ``` 77 | 78 | 4. Start local dev server 79 | 80 | ``` 81 | npm start 82 | ``` 83 | 84 | 5. View local deployment at [http://127.0.0.1:8000](http://127.0.0.1:8000) 85 | 86 | ## 💫 Built on the shoulders of giants 87 | 88 | - [amazing github-readme-stats](https://github.com/anuraghazra/github-readme-stats) by Anurag Hazra for creating detailed statistics 89 | - [github-profile-views-counter](https://github.com/antonkomarev/github-profile-views-counter) by Anton Komarev for simplifying visitor counter 90 | - [blog post workflow](https://github.com/gautamkrishnar/blog-post-workflow) by Gautam Krishna R which is a Genius use of Github Actions. 91 | - [spotify-github-profile](https://github.com/kittinan/spotify-github-profile) by Kittinan which generated Spotify's currently listening album cover image. 92 | 93 | NOTE : All the logos/icons belong to their respective owners , we don't own them. 94 | 95 | ## :heart: Supporting the project 96 | 97 | A simple star to this project repo is enough to keep me motivated on this project for days. If you find your self very much excited with this project let me know with a tweet. 98 | 99 | Thanks! 100 | 101 | Contributions are welcomed! 102 | -------------------------------------------------------------------------------- /gatsby-browser.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Implement Gatsby's Browser APIs in this file. 3 | * 4 | * See: https://www.gatsbyjs.org/docs/browser-apis/ 5 | */ 6 | 7 | import 'antd/dist/antd.css'; 8 | import './src/styles/global.scss'; 9 | 10 | import Provider from './src/context/GlobalContextProvider'; 11 | 12 | export const wrapRootElement = Provider; -------------------------------------------------------------------------------- /gatsby-config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | siteMetadata: { 3 | title: `Rishav's Blog`, 4 | description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`, 5 | author: `@gatsbyjs`, 6 | }, 7 | plugins: [ 8 | `gatsby-plugin-react-helmet`, 9 | { 10 | resolve: `gatsby-source-filesystem`, 11 | options: { 12 | name: `images`, 13 | path: `${__dirname}/src/images`, 14 | }, 15 | }, 16 | { 17 | resolve: `gatsby-source-filesystem`, 18 | options: { 19 | name: `pages`, 20 | path: `${__dirname}/src/pages`, 21 | }, 22 | }, 23 | `gatsby-transformer-sharp`, 24 | `gatsby-plugin-sharp`, 25 | { 26 | resolve: `gatsby-plugin-manifest`, 27 | options: { 28 | name: `gatsby-starter-default`, 29 | short_name: `starter`, 30 | start_url: `/`, 31 | background_color: `#663399`, 32 | theme_color: `#663399`, 33 | display: `minimal-ui`, 34 | icon: `src/images/gatsby-icon.png`, // This path is relative to the root of the site. 35 | }, 36 | }, 37 | // this (optional) plugin enables Progressive Web App + Offline functionality 38 | // To learn more, visit: https://gatsby.dev/offline 39 | // `gatsby-plugin-offline`, 40 | 'gatsby-plugin-catch-links', 41 | 'gatsby-plugin-sass', 42 | 'gatsby-transformer-remark', 43 | { 44 | resolve: 'gatsby-plugin-use-dark-mode', 45 | options: { 46 | classNameDark: 'dark-mode', 47 | classNameLight: 'light-mode', 48 | storageKey: 'darkMode', 49 | minify: true, 50 | }, 51 | }, 52 | { 53 | resolve: `gatsby-plugin-google-analytics`, 54 | options: { 55 | trackingId: 'UA-174597578-1', 56 | head: false, 57 | }, 58 | }, 59 | { 60 | resolve: 'gatsby-plugin-antd', 61 | options: { 62 | style: true, 63 | }, 64 | }, 65 | { 66 | resolve: `gatsby-plugin-less`, 67 | options: { 68 | lessOptions: { 69 | modifyVars: { 70 | 'primary-color': '#1853db', 71 | 'link-color': '#1853db', 72 | 'border-radius-base': '20px', 73 | }, 74 | javascriptEnabled: true, 75 | }, 76 | }, 77 | }, 78 | ], 79 | }; 80 | -------------------------------------------------------------------------------- /gatsby-node.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Implement Gatsby's Node APIs in this file. 3 | * 4 | * See: https://www.gatsbyjs.org/docs/node-apis/ 5 | */ 6 | 7 | // You can delete this file if you're not using it 8 | -------------------------------------------------------------------------------- /gatsby-ssr.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Implement Gatsby's SSR (Server Side Rendering) APIs in this file. 3 | * 4 | * See: https://www.gatsbyjs.org/docs/ssr-apis/ 5 | */ 6 | 7 | // You can delete this file if you're not using it 8 | 9 | import Provider from './src/context/GlobalContextProvider'; 10 | 11 | export const wrapRootElement = Provider; -------------------------------------------------------------------------------- /netlify.toml: -------------------------------------------------------------------------------- 1 | [build.environment] 2 | PYTHON_VERSION = "3.9" -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "github-profilinator", 3 | "private": true, 4 | "description": "Awesome GitHub readme profile generator", 5 | "version": "0.1.0", 6 | "author": "Rishav Anand ", 7 | "dependencies": { 8 | "@fortawesome/fontawesome-free": "^5.14.0", 9 | "@fortawesome/fontawesome-svg-core": "^1.2.30", 10 | "@fortawesome/free-brands-svg-icons": "^5.14.0", 11 | "@fortawesome/free-solid-svg-icons": "^5.14.0", 12 | "@fortawesome/react-fontawesome": "^0.1.11", 13 | "antd": "^4.22.8", 14 | "emoji-mart": "^3.0.0", 15 | "gatsby": "^2.24.15", 16 | "gatsby-image": "^2.4.14", 17 | "gatsby-plugin-antd": "^2.2.0", 18 | "gatsby-plugin-google-analytics": "^2.3.13", 19 | "gatsby-plugin-less": "^5.0.0", 20 | "gatsby-plugin-manifest": "^2.4.21", 21 | "gatsby-plugin-offline": "^3.2.21", 22 | "gatsby-plugin-react-helmet": "^5.20.0", 23 | "gatsby-plugin-sass": "^2.3.12", 24 | "gatsby-plugin-sharp": "^2.6.24", 25 | "gatsby-plugin-smoothscroll": "^1.2.0", 26 | "gatsby-plugin-use-dark-mode": "^1.1.2", 27 | "gatsby-transformer-sharp": "^2.5.12", 28 | "marked": "^2.0.0", 29 | "prop-types": "^15.7.2", 30 | "react": "^16.13.1", 31 | "react-copy-to-clipboard": "^5.0.3", 32 | "react-dom": "^16.13.1", 33 | "react-helmet": "^6.1.0", 34 | "react-scroll": "^1.8.0", 35 | "styled-components": "^5.1.1", 36 | "use-dark-mode": "^2.3.1", 37 | "uuid": "^8.3.0" 38 | }, 39 | "devDependencies": { 40 | "@babel/runtime": "^7.18.6", 41 | "@types/antd": "^1.0.0", 42 | "@types/emoji-mart": "^3.0.2", 43 | "@types/marked": "^1.1.0", 44 | "@types/react-copy-to-clipboard": "^5.0.3", 45 | "@types/react-helmet": "^6.1.5", 46 | "@types/react-scroll": "^1.5.5", 47 | "@typescript-eslint/eslint-plugin": "^3.7.1", 48 | "@typescript-eslint/parser": "^3.7.1", 49 | "babel-runtime": "^6.26.0", 50 | "eslint": "^7.5.0", 51 | "eslint-config-prettier": "^6.11.0", 52 | "eslint-plugin-prettier": "^3.1.4", 53 | "gatsby-plugin-catch-links": "^2.3.11", 54 | "gatsby-source-filesystem": "^2.3.23", 55 | "gatsby-transformer-remark": "^2.8.27", 56 | "husky": "^4.2.5", 57 | "node-sass": "^4.14.1", 58 | "prettier": "^2.0.5", 59 | "react-refresh": "^0.8.3", 60 | "ts-node": "^8.10.2", 61 | "typescript": "^3.9.7" 62 | }, 63 | "keywords": [ 64 | "github", 65 | "profile", 66 | "readme", 67 | "generator", 68 | "react", 69 | "gatsby" 70 | ], 71 | "license": "MIT", 72 | "scripts": { 73 | "build": "gatsby build", 74 | "develop": "gatsby develop", 75 | "format": "prettier --write \"**/*.{js,jsx,json,md}\"", 76 | "start": "npm run develop", 77 | "serve": "gatsby serve", 78 | "clean": "gatsby clean", 79 | "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1", 80 | "lint": "eslint '*/**/*.{js,ts,tsx}' --quiet --fix", 81 | "info": "echo \"Node version: $(node -v)\" && echo \"NPM version: $(npm -v)\"" 82 | }, 83 | "husky": { 84 | "hooks": { 85 | "pre-commit": "npm run lint" 86 | } 87 | }, 88 | "repository": { 89 | "type": "git", 90 | "url": "https://github.com/rishavanand/rishav.dev" 91 | } 92 | } 93 | -------------------------------------------------------------------------------- /src/components/Field/BlogPostField.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | export const generateBlogPostMarkdown = () => { 4 | return ` \nIf things goes well, this section should automatically be replaced by a list of your blog posts after you commit your readme file. \n`; 5 | }; 6 | 7 | export const BlogPostField = () => { 8 | return ( 9 | <> 10 | This is a blog post field. It does not have a URL input box because the URL needs to be added to Github 11 | Action. After you add the generated markdown to your README, you have to enable the{' '} 12 | 13 | Blog Post Workflow 14 | {' '} 15 | for auto updating README.{' '} 16 | 17 | ); 18 | }; 19 | 20 | export default BlogPostField; 21 | -------------------------------------------------------------------------------- /src/components/Field/ProfileVisitorCounterField.tsx: -------------------------------------------------------------------------------- 1 | import React, { useContext } from 'react'; 2 | import { Input, Row, Col, Button, Dropdown, Menu, Form, Switch, Tooltip } from 'antd'; 3 | import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; 4 | import styles from '../../styles/fields.module.scss'; 5 | import { faAlignLeft } from '@fortawesome/free-solid-svg-icons'; 6 | import { FieldProps } from '.'; 7 | 8 | const { TextArea } = Input; 9 | 10 | export enum STATS_ALIGNMENT { 11 | LEFT = 'left', 12 | CENTRE = 'center', 13 | RIGHT = 'right', 14 | } 15 | 16 | export interface FiledOptions { 17 | alignment?: STATS_ALIGNMENT; 18 | } 19 | 20 | export interface FieldData { 21 | username?: string; 22 | } 23 | 24 | export interface ProfileVisitorCounterProps extends FieldProps { 25 | id?: string; 26 | data?: FieldData; 27 | options?: FiledOptions; 28 | } 29 | 30 | export const generateAlignmentTags = (alignment: STATS_ALIGNMENT, type: 'start' | 'end') => { 31 | if ((alignment === STATS_ALIGNMENT.CENTRE || alignment === STATS_ALIGNMENT.RIGHT) && type === 'start') 32 | return `
\n`; 33 | else if ((alignment === STATS_ALIGNMENT.CENTRE || alignment === STATS_ALIGNMENT.RIGHT) && type === 'end') 34 | return `\n
`; 35 | else return ''; 36 | }; 37 | 38 | export const generateImageTag = (data: FieldData, options: FiledOptions) => { 39 | const statsUrl = `https://komarev.com/ghpvc/?username=${data.username}&&style=flat-square`; 40 | if ( 41 | options.alignment && 42 | (options.alignment === STATS_ALIGNMENT.CENTRE || options.alignment === STATS_ALIGNMENT.RIGHT) 43 | ) 44 | return ``; 45 | else return `![Profile views counter](${statsUrl})`; 46 | }; 47 | 48 | export const generateProfileVisitorCounterMarkdown = ({ data, options }: FieldProps) => { 49 | if (!options) options = {}; 50 | if (!data) 51 | data = { 52 | username: '', 53 | }; 54 | if (!data.username) return ``; 55 | return ( 56 | `${generateAlignmentTags(options.alignment, 'start')}` + 57 | `${generateImageTag(data, options)}` + 58 | `${generateAlignmentTags(options.alignment, 'end')}` + 59 | ` \n` 60 | ); 61 | }; 62 | 63 | export const ProfileVisitorCounterField = ({ 64 | fieldProps, 65 | modifyField, 66 | }: { 67 | fieldProps: ProfileVisitorCounterProps; 68 | modifyField: (filedProps: ProfileVisitorCounterProps) => void; 69 | }) => { 70 | const localProps: typeof fieldProps = { 71 | options: {}, 72 | data: {}, 73 | ...fieldProps, 74 | }; 75 | 76 | const onChange = (event: React.ChangeEvent) => { 77 | const name = event.target.name; 78 | const value = event.target.value; 79 | if (name === 'username') 80 | modifyField({ 81 | ...localProps, 82 | data: { 83 | ...localProps.data, 84 | username: value, 85 | }, 86 | }); 87 | }; 88 | 89 | const changeAlignment = (alignment: STATS_ALIGNMENT) => { 90 | if (!localProps.options) localProps.options = {}; 91 | localProps.options.alignment = alignment; 92 | modifyField(localProps); 93 | }; 94 | 95 | const alignmentMenu = ( 96 | 97 | changeAlignment(STATS_ALIGNMENT.LEFT)}> 98 | Left 99 | 100 | changeAlignment(STATS_ALIGNMENT.CENTRE)}> 101 | Centre 102 | 103 | changeAlignment(STATS_ALIGNMENT.RIGHT)}> 104 | Right 105 | 106 | 107 | ); 108 | 109 | return ( 110 | <> 111 | 112 | 113 | 114 | Alignment}> 115 |