Code Monkey home page Code Monkey logo

aklilu-mandefro / myportfolio Goto Github PK

View Code? Open in Web Editor NEW
19.0 1.0 8.0 14.07 MB

myPortfolio is a personal website that can be used by any Digital Professionals including Developers and Designers.

Home Page: https://myportfolio-et.vercel.app/

License: MIT License

JavaScript 34.13% CSS 45.96% SCSS 19.91%
personal-website-in-html-and-css personal-website-in-react portfolio-application-in-react developers-portfolio developers-portfolio-application personal-website-with-next-js portfolio-app-in-nextjs blog-application blog-application-in-nextjs blog-application-in-react

myportfolio's Introduction

✍️ myPortfolio

myPortfolio is a personal website that can be used by any Digital Professionals including Developers and Designers.

Motivation behind this App

In today's digital age, establishing a strong online presence is crucial for professionals across various industries. A personal website serves as your digital storefront, offering a platform to showcase your skills, projects,blog posts, accomplishments, and more. And that why I built this open source app.

Whether you're a seasoned developer, a creative designer, a freelance writer, or any other digital professional, having your corner of the internet can significantly impact your professional and personal growth positively in several ways. So, fork this application, customize it and make it your digital home base — a place where you can curate your online presence, showcase your skills, projects, accomplishments, and tell your story in a way that's entirely unique to you.

Technologies used

  • React(v18+)
  • Next.js(v13+)
  • Bootstrap5
  • CSS3
  • HTML5
  • MailChimp API
  • Formspree API
  • Google fonts

Installation

  1. Install Node and npm
  2. Fork the project
  3. Install packages
npm install or yarn install or npm i
  1. Start the development server
npm run dev or yarn dev

Then, navigate to localhost:3000/. to view it in the browser. The src will automatically reload if you change any of the source files.

  1. Build for production
npm run build or yarn build
  1. Run production mode
npm start or yarn start

The portfolio app homepage

Switch Between Light and Dark mode

The default mode is light version. But, you can change it by navigating to the src/pages/app.js/ directory. Then, you will find the dark and light sections from line 5 and 6 respectively. Simply comment out one to apply the other.

Newsletter Form Configuration

Head over to MailChimp website, create an account and get your API URL and key. Once you are done, navigate to src/data/app.json. Open app.json file and paste your MailChimp API URL and key into URL and key sections at line 10 and 11 respectively.

Contact Form Configuration

Head over to Formspree website, create an account and get your API. Once you are done, navigate to src/data/app.json. Open app.json file and paste your formspree API into formspreeURL section at line 8.

Issues

If you find any issues while installing or using the app, kindly open an issue with the tag "enhancement". Note: Make sure you browse through the existing issues to check if the issue already exists.

Contribution

Any contributions you make are greatly appreciated.

If you have a suggestion that would make this app better, please fork the repo and create a pull request. You can also simply open a discussions or an issue with the tag "enhancement".

Credits for the images used in this app

Please give this repo a ⭐ if you found it helpful and share it with your friends.

myportfolio's People

Contributors

aklilu-mandefro avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

myportfolio's Issues

Nice features available for contribution

You can contribute to this project by adding new features that can make the app better. But, As a staring point, here are some features to work on: 👇:

Multilingual Support:

  • Allow the website to be translated and displayed in multiple languages, catering to a global audience.
  • Implement a content localization system that makes it easy for the owner to manage translations.

Analytics and Tracking:

  • Integrate web analytics tools to track visitor behavior, engagement metrics, and other relevant data.
  • Provide the website owner with insights and reporting to help them understand their audience and make data-driven decisions.

Search and Filtering:

  • Implement a search functionality that allows visitors to quickly find relevant content on the website.
  • Develop filtering and sorting options for the portfolio, blog, or other sections to enhance the user experience.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.