community-user-profile
community-user-profile copied to clipboard
👨💻 Profile page, but for developers — GraphQL API is used to fetch data from GitHub.
Profile page, but for developers.
Screenshots
Acknowledgment
This interface was inspired by the design available on Dribbble.
Technology stack
This project was developed using cutting edge front-end technologies.
- TypeScript — TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
- Next.js — The Next.js is React Based framework with server side rendering capability.
- Styled Components — CSS-in-JS library built for React.
- React Icons — SVG React icons of popular icon packs using ES6 imports.
- GitHub GraphQL API — GitHub GraphQL API is used to fetch data from GitHub.
- DEV REST API — DEV REST API is used to fetch data from Dev.to.
Pre-requisites
Have the following pre-installed:
Run Locally
Clone the project:
git clone https://github.com/fariasmateuss/community-user-profile.git
Go to the project directory:
cd community-user-profile
Install all dependencies:
yarn
Create a copy of the .env.example
file called .env.local
:
cp .env.example .env.local
Add your GitHub App's private key to the .env.local
file.
Note: The token is used as the HTTP username.
Start the server:
yarn dev
or
yarn next
Open http://localhost:3000 with your browser to see the result.
Building the app
To prepare the build for production:
yarn build
And run it:
yarn start
Contributing
You can send how many PR's do you want, I'll be glad to analyse and accept them! If you have any questions, suggestions or bug reports drop here.
Contact me
Connect with me at LinkedIn.
License
This project is under the MIT License.
Made with ♥ by Mateus V. Farias.