Giter VIP home page Giter VIP logo

aarabii / v4 Goto Github PK

View Code? Open in Web Editor NEW
18.0 1.0 9.0 26.4 MB

Presonal portfolio website based on react

Home Page: https://aarabii.vercel.app/

License: MIT License

CSS 41.58% JavaScript 48.55% HTML 2.45% SCSS 7.42%
css css-animations heroku heroku-app heroku-deployment herokuapp javascript portfolio portfolio-website presonal presonal-website react react-hooks react-router reactjs scss customwebsite free freetouse

v4's Introduction

Contributors Forks Stargazers Issues MIT License LinkedIn


Logo

V4

An awesome portfolio website to showcase your skills and projects!
Explore the docs »

View Demo · Report Bug · Request Feature
Vercel

Table of Contents
  1. About The Project
  2. Getting Started
  3. Usage
  4. Roadmap
  5. Contributing
  6. License
  7. Contributors
  8. Contact
  9. Acknowledgments

About The Project

Preview of the site Responsiveness of the site
Product Name Screen Shot Product Name Screen Shot

This is a personal portfolio website built using React and hosted on Vercel, with the support of Email.js for easy communication with potential employers, clients, and collaborators. The portfolio showcases my skills, experience, and projects in an engaging and interactive way, with a clean design and intuitive navigation that provides a user-friendly experience. The project can also serve as a valuable resource for anyone looking to create their own portfolio website, with its modern web development practices and customizable design.

(back to top)

Built With

  • React
  • Bootstrap

(back to top)

Getting Started

  1. Clone the repository to your local machine using Git.
  2. Install the necessary dependencies by running npm install.
  3. Customize the content and design of the portfolio to fit your needs.
  4. Run the development server using npm start.
  5. Open your web browser and navigate to http://localhost:3000/ to view the portfolio.

Prerequisites

Install the following software on your computer:

  • Git

  • Node.js

  • npm (comes with Node.js)

  • Yarn (optional but recommended)

    • To install these tools on Windows using winget and PowerShell:
      •   winget install -e --id Git.Git
          winget install -e --id Nodejs.Nodejs
          winget install -e --id Yarn.Yarn
    • To install these tools on Windows using chocolatey and PowerShell:
      •   choco install git
          choco install nodejs
          choco install yarn

Installation

  1. Clone the repo
    git clone https://github.com/your_username_/Project-Name.git
  2. Go to the project directory
    cd project-directory
  3. Install NPM packages
    npm install
  4. Start the project
     npm start
  5. Open the project in your browser (Don't worry, it will open automatically)
    http://localhost:3000
  6. Edit the config.js file to add your own information and save it.
  7. Build the project
    npm run build
  8. Deploy the project to your hosting service (like Vercel or Netlify) and enjoy your new portfolio!

(back to top)

Usage

My portfolio (v4) repo can serve as a useful resource for anyone looking to create their own portfolio website. With its clean design and intuitive navigation, this project provides an excellent starting point for showcasing skills and experience. The integration of Email.js also allows for easy communication with potential employers, clients, and collaborators. Whether you're a freelancer, job seeker, or simply looking to build your online presence, this portfolio (v4) repo can provide inspiration and practical solutions for your web development needs.

For more examples, please refer to the Documentation

(back to top)

Roadmap

  • Add README and LICENSE
  • Add Responsive CSS for project page
  • Fix Contact system
  • Fix ring cursor for small devices

See the open issues for a full list of proposed features (and known issues).

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

(back to top)

License

MIT License. See LICENSE for more information.

(back to top)

Contributors

Avatar Name Contribution
Losier Owner of this Repo
Sneh Patel coming soon responsive check
Nihal Arya Create CODE_OF_CONDUCT.md
Gal Malach fix the navbar when scroll
makssmeinart 1. Fixed few paddings in Navbar on mobile resolutions. 2. Added small…
Carlos Alba Redirect to a section in react
Ullas Kunder 🐼fixed mobile view and some bugs
Thendo fix loader ring issue

(back to top)

Contact

Aarab - @aarabuibuibui - [email protected]

Project Link: https://github.com/losier/v4

(back to top)

Acknowledgments

(back to top)

v4's People

Contributors

aarabii avatar aryanihal avatar carlosalbalopez avatar dependabot[bot] avatar galmalach08 avatar imgbotapp avatar makssmeinart avatar spbavarva avatar thendo-t avatar ullaskunder3 avatar

Stargazers

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

Watchers

 avatar

v4's Issues

Need some ideas for my portfolio :) (REACTjs)

Hey, I wanted to work on this project and wanted to improve it, but my exams are going on so I don't get much time to work on this if Anyone out there wanted to work or has any ideas to improve this repo please let me know.
please create an issue or PR to let me know about your ideas and works I'll be thankful to you

Redirect to a section in react

Ok so the issue is I don't have an About, Experience, and the Contact page but I have them on my Home Page so I want to redirect the option so that if someone searches for myWebsite.com/about it should return the about section in Home page i.e., myWebsite.com/#about

I really want this on my website if you are not sure too still give it a try (if you are able and wanted to)
I'll be always thankful to you for this

404 Page setup

Can some one help me to add this 404Page in my app i tried using react router but failed... This app is depolyed on heroku

Need to make a page responsive for mobile and tablets devices

Hello,
I want some if you have time can you help me to fix the CSS for ComingSoon Page.
My exams are going on so I don't get much time for this now and a responsive page takes much time so I need help
I will be thankful to you if you can do this for me
Thank you.

  • Make changes in comingSoon.css to make it responsive

  • Create a PR

  • Or let me know if you need some help from me too ill try my best

Need to stop scroll if navbar is open

Everything is kinda fine but im still able to scroll through the main mage if nav bar is open if anyone can fix this ill be thankful to you
Thank you

Too many projects

I love your portfolio, it has a nice color but I will say one thing here, when making a portfolio, it is advised to keep it to 3-5 projects, and they should be the best projects you have worked on. Tho this only applies if your target audience for your portfolio is recruiters aka you want people to see your portfolio and offer a job to you

Fix the css

As you can see the CSS of websites projects page doesn't look good if you can fix the CSS for me ill be thankful to you.
css
THANK YOU

Fix: Nav bar

Can someone help me to fix my nav bar it works fine but doesn't change its icon when we scroll manually to a section

UPDATE README

Need to update README.md file according to the files

FIX to basic CSS

so I have added a custom cursor recently after that my preloader which is in scss looks kinda weird and I'll be thankful to you if you can fix it you can visit this portfolio and you will notice what's weird here
Thank you...

Convert to TypeScript

So this repo is in javascript and its working file but i'm thinking to shift this project to type-script

Need to convert all jsx file to tsx and do some basic changes according to typescript

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.