Code Monkey home page Code Monkey logo

portfolio's Introduction


logo

Portfolio



Table of Contents πŸ“‹



Portfolio πŸ“–

It is a Portfolio website built with HTML, CSS, and JavaScript. It shows information about my experience as a web developer, including the recent works.


Screenshot πŸ“·

The screenshot below is a mobile version of the portfolio.


Home section screenshot

Work section screenshot

About section screenshot

(back to top)



Built With πŸ› 

Tech Stack πŸ—œοΈ

This portfolio is build with:

  • HTML5 markup to build raw structure of this web page

  • CSS3 custom properties, FlexBox, Grid to make the website visually attractive

  • Javascript for dynamic functionality

  • Node JS as a javascript runtime machine [git], a free and open source distributed version control system

  • Linter tool that analyzes my source code to flag programming errors, bugs, stylistic errors, and suspicious constructs.

(back to top)



Key Features 🏷️

  • The project is UI responsive.πŸ’―
  • The section "recent works" was created dynamically in JavaScript.

(back to top)



Getting Started πŸ’»

Before proceeding to the installation phase, you must ensure that you meet the following prerequisites...

Prerequisites 🧱

In order to run this project you need:



Setup βš™οΈ

In order to run this project you need to:

  • open your code editor
  • Clone this repository to your desired folder:
    git clone https://github.com/lily4178993/Portfolio.git
  • Navigate to the folder
cd Portfolio
  • Checkout the branch
git checkout main



Install πŸ—οΈ

Install all dependencies:

    npm install



Usage πŸ“‚

To run the project, follow these instructions:

  • You have to clone this repo to your local machine.
git clone https://github.com/lily4178993/Portfolio
  • If you want to run it on your preferred browser, open index.html or about.html.



Run tests πŸ§ͺ

How should it be tested? To run tests, run the following command:

  • HTML linter errors run:
npx hint . --fix
  • CSS linter errors run:
npx stylelint "**/*.{css,scss}" --fix
  • JavaScript linter errors run:
npx eslint . --fix
  • For unit testing, run:
npm test



Deployment

You can deploy this project using: GitHub Pages, Vercel or Netlify.

I used GitHub Pages to host my website. For more information about how to use GitHub pages read here 🀩. If you want to watch a video about how to use GitHub pages instead of reading click here ☺️.

(back to top)



Author πŸ‘€



Want to get in touch with me πŸ“²? Here are my social links:

GitHub


Twitter

LinkedIn

(back to top)



Future Features πŸ”­

In the near future, I plan to add:

  • more recents projects

(back to top)



Contributing 🀝

If you have suggestions πŸ“, ideas πŸ€”, or bug reports πŸ›, please feel free to open an issue on GitHub. Remember, every contribution, no matter how big or small, makes a difference.

(back to top)



Show your support 🌟

Thank you for taking the time to explore my GitHub project! Your support means a lot to me. If you find my project valuable and would like to contribute, here are a few ways you can support me:

  • Star the project ⭐️: Show your appreciation by starring this GitHub repository. It helps increase visibility and lets others know that the project is well-received.

  • Fork the project 🍴 🎣: If you're interested in making improvements or adding new features, feel free to fork the project. You can work on your own version and even submit pull requests to suggest changes.

  • Share with others πŸ—ΊοΈ: Spread the word about this project. Share it on social media, mention it in relevant forums or communities, or recommend it to colleagues and friends who might find it useful.

(back to top)



Acknowledgments πŸ™

I would like to express my sincere gratitude to Microverse, the dedicated reviewers, and my partners: kit0-0 and Mike111222. Your unwavering support, feedbacks, and collaborative efforts have played an immense role in making my journey a resounding success. Thank you for being an integral part of my achievements.

(back to top)

License πŸ“

This project is MIT licensed.

(back to top)

portfolio's People

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar

portfolio's Issues

Mobile Navigation bug

Great job so far with the screen size transition

  • On the mobile menu item when clicked it won't redirect to the menu item section

Form validation bug

  • The validation was not happening due to a wrong class name on Email field, kindly correct the class name to 'Email'
  • The eventListener should be submit, not sbmit. Please correct it. By Cosmas and Ahmed.

Code deployment

As a beginner developer, I want to master code deployment so I can easily deploy my own app and make sure the app is working properly.

You can follow this link to have a live demonstration of my current portfolio.

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.