https://github.com/gardimy/mobile-first
This is a starter exercise to create a portfolio website that can be used by multiple devices by listing the portfolio projects. And also using CSS animation makes the website more interactive. I use github pages to deploy this project. It is based on specific settings and requirements to ensure proper structure and best practices.
https://github.com/gardimy/mobile-first
css eslint-config html javascript linter
Last synced: 9 months ago
JSON representation
This is a starter exercise to create a portfolio website that can be used by multiple devices by listing the portfolio projects. And also using CSS animation makes the website more interactive. I use github pages to deploy this project. It is based on specific settings and requirements to ensure proper structure and best practices.
- Host: GitHub
- URL: https://github.com/gardimy/mobile-first
- Owner: Gardimy
- Created: 2023-03-22T16:41:11.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2023-12-20T14:16:35.000Z (over 2 years ago)
- Last Synced: 2025-01-08T08:24:09.812Z (over 1 year ago)
- Topics: css, eslint-config, html, javascript, linter
- Language: CSS
- Homepage: https://gardimy.github.io/Mobile-first/
- Size: 1.12 MB
- Stars: 8
- Watchers: 1
- Forks: 0
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Validate contact form
A Microverse exercise to use animation on a website
Validate contact form
# 📗 Table of Contents
- [📖 About the Project](#about-project)
- [🛠 Built With](#built-with)
- [Tech Stack](#tech-stack)
- [Key Features](#key-features)
- [🚀 Live Demo](#live-demo)
- [💻 Getting Started](#getting-started)
- [Setup](#setup)
- [Prerequisites](#prerequisites)
- [Install](#install)
- [Usage](#usage)
- [👥 Authors](#authors)
- [🔭 Future Features](#future-features)
- [🤝 Contributing](#contributing)
- [⭐️ Show your support](#support)
- [🙏 Acknowledgements](#acknowledgements)
- [📝 License](#license)
> **Validate contact form** is a starter exercise to create a portfolio website that can be used by multiple
devices by listing the portfolio projects. And also using CSS animation makes the website more interactive.
It is based on specific settings and requirements to ensure proper structure and best practices.
By cloning this repo and running `npm install` we will have a basic portfolio with properly configured linters,
eslint and the correct initial file structu
> This project focuses only on `linters` and `.gitignore`. and JS or Server are included in this repo.
Client
Server
- **Linters**: [Lighthouse](https://developer.chrome.com/docs/lighthouse/overview/), [Webhint](https://webhint.io/), and [Stylelint](https://stylelint.io/.)
- **A `.github/workflows/linters.yml`** file to run linters on GitHub Pull Request.
- **A** `.gitignore` file including `node_modules/`.
-**Eslint**npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x
[ -f .eslintrc.json ] || wget https://raw.githubusercontent.com/microverseinc/linters-config/master/html-css-js/.eslintrc.json
- name: ESLint Report
- [Live Demo Link](https://gardimy.github.io/Mobile-first/)
>If you are a new developer and would like to have a basic project to start practicing your code or creating your first portfolio app-features using good practice JavaScript ,HTML and CSS : Cloning this project will give you what you need!
> To get a local copy up and running, follow these steps:
### Prerequisites
In order to run this project you need:
- Have [npm](https://www.npmjs.com/package/npm) installed in your project:
`curl -qL https://www.npmjs.com/install.sh | sh`
### Setup
Clone this repository to your desired folder:
`git clone https://github.com/Gardimy/Mobile-first`
or
`git clone https://github.com/Gardimy/Mobile-first` <-- _Only if you have [SSH keys configured](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/adding-a-new-ssh-key-to-your-github-account) on your GitHub account_.
### Install:
run the `npm install` command in your console.
### Usage
To run the linters before committing any changes to your code, execute the following commands:
`npx hint .`
`npx stylelint "**/*.scss"` <--_NOTE: this repo is set up to use with SCSS. If you would like to use CSS, you must replace `"**/*.scss"` with `"**/*.{css,scss}"` in **line 48** of the `.stylelintrc.json` file, and run the linter with:_
`npx stylelint "**/*.{css,scss}"` _instead_.
> 👤 **Gardimy Charles**
- GitHub: [@Gardimy](https://github.com/Gardimy)
- Twitter: [@gardyelontiga45](https://twitter.com/gardyelontiga45)
- LinkedIn: [Gardimy charles](https://www.linkedin.com/in/gardimy-charles)
> 👤 **Mahmudur Rahman**
- GitHub: [@MoyasiGinko](https://github.com/MoyasiGinko)
- LinkedIn: [@mahmudur-rahman-a8a151257](https://www.linkedin.com/in/mahmudur-rahman-a8a151257/)
- Twitter: [@moyasi_ginko](https://twitter.com/moyasi_ginko)
- [ESLint](https://eslint.org/).
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](https://github.com/Gardimy/Mobile-first/issues/7).
> If you like this project please give me a star on GitHub.And Don't hesitate to follow me on github, you will have the opportunity to get all updating available for this project.
> I would like to thank [Microverse](https://www.microverse.org/) for teaching me these tools.
This project is [MIT license](https://choosealicense.com/licenses/mit/) licensed.
_NOTE: we recommend using the [MIT license](https://choosealicense.com/licenses/mit/) - you can set it up quickly by [using templates available on GitHub](https://docs.github.com/en/communities/setting-up-your-project-for-healthy-contributions/adding-a-license-to-a-repository). You can also use [any other license](https://choosealicense.com/licenses/) if you wish._