Top Rating
- Top Contributors
  Discover the Top Open Source contributors by country or by language
- Interviews
  Discover real stories from Open Source developers
Discover

Discover your Favorite Language
Discover the top trending repositories and projects on Github. Explore the latest trends in your preferred languages.

OCaml

Crystal

CSS

Nix

Shell

Zig

R

CoffeeScript

More Languages
Awesome

Awesome repositories
Discover the most awesome repositories and projects of your favorite languages. Inspired by the Awesome-* lists trend in GitHub.

Elixir

Elm

Scala

Rust

Shell

Ruby

Perl

C

More Languages
By Country

Rankings by Country
Discover the community of talented open source contributors in each country.

🇧🇼 Botswana

🇨🇿 Czechia

🇳🇵 Nepal

🇨🇴 Colombia

🇫🇮 Finland

🇨🇰 Cook Islands

🇷🇸 Serbia

🇸🇩 Sudan

All Countries Compare Countries

codebucks27/Next.js-Developer-Portfolio-Starter-Code

Stars
741
Rank 61,194 (Top 2 %)
Language
CSS
Created over 1 year ago
Updated 6 months ago

codebucks27/Next.js-Developer-Portfolio-Starter-Code

codebucks27

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

⭐Build a stunning portfolio website with Next.js, Tailwind CSS and Framer-motion. If you want to learn to create this you can follow the tutorial link given in the Read me file.

Next.Js Website Tutorial: Create a Stunning Portfolio Website with Nextjs, Tailwind CSS and Framer-motion🌟

This repository contains starter code for Portfolio website created using NextJs.

For Demo and Final Code checkout following link👇:
Nextjs Portfolio Website

If you want to learn how to create it please follow below tutorial👇:
https://youtu.be/Yw7yWHigGKI

▶ Support me via:

Images of The Portfolio Website:

Resources Used in This Project

Profile image in the home page created by using https://www.midjourney.com/ tool.
Profile image in the about page by Albert Dera on Unsplash.
Fonts from https://fonts.google.com/
Icons from https://iconify.design/
LightBulb Svg from https://lukaszadam.com/illustrations

External Libraries used in this project:

Nextjs-tailwindcss-blog-template

⭐Build SEO optimized personal blog website with Next.js, Tailwind CSS and Contentlayer. If you want to learn to create this you can follow the tutorial link given in the Read me file.

react-portfolio-final

Build a Stunning portfolio with React JS and framer-motion. This portfolio is created using framer-motion for cool transitions and animation. If you want to learn how to create this portfolio then you can follow below tutorial link in the ReadMe

The-Weirdos-NFT-Website-Starter-Code

Build a cool NFT Collection website landing page with React JS . This website is created using Gsap for cool scrolling and animation. If you want to learn how to create this website then you can follow below tutorial link in the ReadMe.

Agency-website

Agency Landing Page. It is build on top of the React JS, with styled-components and GSAP for smooth scrolling animations. Create this awesome website in React by following the tutorial given in the readme file.

Next.js-Creative-Portfolio-Website

Interactive 3D Portfolio Website with Next.js, Three.js & Tailwind CSS | Checkout the tutorial link ⚡

Nextjs-contentlayer-blog

⭐Build SEO optimized personal blog website with Next.js, Tailwind CSS and Contentlayer. If you want to learn to create this you can follow the tutorial link given in the Read me file.

wibe-studio

Build a stunning Fashion Studio Website Landing page with React JS. This website is created using locomotive-scroll for smooth scrolling. Also, GSAP and Framer-Motion for some custom animations and effects. You can learn to make this website by visiting the tutorial link from the description.

react-sidebar

Create awesome sidebar for your portfolio or any projects, It is build using ReactJs and styled-components. React router is already configured, Also it has page transition effect using framer-motion.

React-responsive-navbar

Create responsive navbar with React Js. This navbar is responsive which means you can also use this in smaller devices like mobile / tablets. Follow the tutorial link given in the readme file to learn it.

React-Portfolio-starter-code-files

Build a Stunning portfolio with React JS and framer-motion. This portfolio is created using framer-motion for cool transitions and animation. If you want to learn how to create this portfolio then you can follow below tutorial link in the ReadMe

3D-Landing-page-for-Apple-iPhone

Create awesome landing page for Apple iPhone 14 using Three JS and React JS. This website uses threeJS to render 3D model of iPhone and GSAP for scrolling animations. If you want to learn how to create this website then you can follow tutorial link given in the ReadMe.

React-Redux-Todo-App

Build a CRUD application with React and Redux. Use Redux toolkit to build this todo app with cool animations using framer-motion. If you want to learn it then you can follow the tutorial given in the readme file.

devto-clone

build a Clone with React. Create this awesome devto clone with React using styled-components. Learn to fetch API and render different articles of dev.to

wibe-studio-starter-files

Build a stunning Fashion Studio Website Landing page with React JS. This website is created using locomotive-scroll for smooth scrolling. Also, GSAP and Framer-Motion for some custom animations and effects. You can learn to make this website by visiting the tutorial link from the description.

Nextjs-Creative-Portfolio-Starter-Code-Files

Interactive 3D Portfolio Website with Next.js, Three.js & Tailwind CSS | Checkout the tutorial link ⚡

React-Weather-app

Build a weather app in ReactJs using open weather API

CryptoBucks-Final-Code

⭐Build Feature Rich Crypto Screener App with React JS and Tailwind CSS. This App is created with context API, react-router and Cryptocurrency APIs. If you want to learn to create this you can follow the tutorial link given in the Read me file. crypto-

Apple-iphone-3d-landing-page-starter-Code

Create awesome landing page for Apple iPhone 14 using Three JS and React JS. This website uses threeJS to render 3D model of iPhone and GSAP for scrolling animations. If you want to learn how to create this website then you can follow tutorial link given in the ReadMe.

react-job-listing-website

Create Job listing website in React with functionalities like searching, sorting and filtering.

CryptoBucks-A-crypto-screener-application

⭐Build Feature Rich Crypto Screener App with React JS and Tailwind CSS. This App is created with context API, react-router and Cryptocurrency APIs. If you want to learn to create this you can follow the tutorial link given in the Read me file.

Smooth-Scroll-Next.js

Implement smooth scrolling in Next.js with the help of Lenis scroll and add parallax effect using GSAP.

react-pagination-component

Create custom pagination from scratch with React JS. Follow the tutorial link in the readme file to learn it.

React-Form-Component

A custom hook which will be used to handle form inputs and validate them. This hook is reusable so you can use it anywhere in your project or in other projects as well.

ReactJs-Text-Editor

Build text-editor in React JS. Learn to create this text editor with React by following the tutorial link given in the readme file.

reactjs-hamburger-menu

Create Hamburger menu with React JS from scratch. Learn to build this animated hamburger menu by following the link given in the readme file.

codebucks27

Create beautiful GitHub profile. Clone this repo and create your own cool github profile readme file.

React-Loading-Screen

Create different types of cool loading screens or loading indicator with ReactJs. Follow the tutorial link in the readme file.

AI-Powered-Twitter-Bio-Generator

AI powered twitter Bio Generator built Using Next.js and Groq | Shadcn | Llama 3

ReactJs-rock-paper-scissors-game

Create rock paper and scissors game with ReactJs and build cool UI. Learn to create this by following the tutorial from the readme file.

React-Tutorials

Learn React JS with simple explanation and easy examples.

Weather-forecast-website

react-smooth-scroll

A simple way to add smooth scrolling in your React app using smooth-scrollbar. Learn how to add smooth scrolling in React website. webapp.

React-reusable-components

This repository contains React Reusable components. You can learn to create these components from here: https://www.youtube.com/channel/UCeYt6blRBKuNrEg_-282fSA/

React-sliding-signin-signup-form

Create cool login / register form with React JS.

React-Todo-app

Create TODO app in React Js.

Redux-Practice

Learn Redux in simple and easy way. Learn what is Redux-toolkit and how to use it in React app.