DEV Community

umutyesildal
umutyesildal

Posted on

 

I developed a simple but beautiful developer portfolio template using React and Next.js

Software Developer Folio

A clean, beautiful and responsive portfolio template for Developers!

Portfolio Website

Nearly all the components are dynamic and easy to use! Feel free to use it as-is or personalize it as much as you want.

If you'd like to contribute and make this much better for other users, please do.

Project Covers

✔️ Homepage\
✔️ Expertise\
✔️ Experience\
✔️ Work and Projects\
✔️ Contact

To view a live example, click here.

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

The versions i have used in the project.

node@v16.16.0
yarn@1.22.17
git@2.37.3
Enter fullscreen mode Exit fullscreen mode

How To Use

From your command line and clone.

# Clone this repository
git clone https://github.com/umutyesildal/yesildal.me-personal-portfolio.git

# Go into the repository
cd yesildal.me-personal-portfolio

# Install dependencies
yarn

# Start a local dev server
yarn dev
Enter fullscreen mode Exit fullscreen mode

Deployment

For deployment I have used vercel and I am pretty happy with it.

# Build & Development Settings
Framework Preset: Nextjs
Build command: next build
Output directory: default
Install command: yarn
Development command: next
Enter fullscreen mode Exit fullscreen mode

Technologies Used

Top comments (4)

Collapse
 
benny00100 profile image
Benny Schuetz • Edited

Just a small bug-report.

After clicking on "expertise" - the navigation stops working.

Problem is, that the "expertise" section has the same z-index than the navigation element (ie.10). So, the solution would be to increase the nav z-index or decrease the section z-index.

Collapse
 
umerame33620655 profile image
Umer Ameen

I also like Benny suggestions so, I added this

Just reporting a little bug.

The navigation halts after selecting "expertise."
The issue is that the "expertise" section's z-index is the same as the navigation element (ie.10). Therefore, the nav z-index should be raised or the section z-index should be lowered to solve the problem.

Collapse
 
hudsonpotenciano profile image
Hudson Potenciano

I really liked the part of the horizontal scroll, congratulations bro!

Collapse
 
lucasvsouza28 profile image
Lucas Souza

deserves an post just to explain how to do this :D

Visualizing Promises and Async/Await 🤓

async await

☝️ Check out this all-time classic DEV post on visualizing Promises and Async/Await 🤓