Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/pratikagarwalla/nexter
Nexter 🏠 is a luxury real estate website developed during my web development learning journey. This project showcases my skills in CSS Grid Layout, responsive web design, and SASS.
https://github.com/pratikagarwalla/nexter
css grid-layout html responsive-web-design sass
Last synced: 2 days ago
JSON representation
Nexter 🏠 is a luxury real estate website developed during my web development learning journey. This project showcases my skills in CSS Grid Layout, responsive web design, and SASS.
- Host: GitHub
- URL: https://github.com/pratikagarwalla/nexter
- Owner: PratikAgarwalla
- Created: 2024-08-14T16:10:54.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2024-08-14T16:25:23.000Z (5 months ago)
- Last Synced: 2024-11-17T21:40:40.671Z (2 months ago)
- Topics: css, grid-layout, html, responsive-web-design, sass
- Language: HTML
- Homepage: https://nexter-zeta-seven.vercel.app
- Size: 8.33 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Nexter 🏠🌟
**Nexter** is a premium website where users can discover and purchase luxury properties and beautiful villas while connecting with top realtors. Developed during my web development learning journey, Nexter is a testament to the skills and techniques I've acquired, particularly in grid layout and responsive web design. You can explore the live website here: [Nexter Website](https://nexter-zeta-seven.vercel.app/)
## 🌍 About the Project
I am **Pratik Agarwalla**, and Nexter is a significant step in my ongoing web development learning journey. This project allowed me to deepen my understanding of:
- **Grid Layout:** Mastering CSS Grid to create responsive, flexible layouts.
- **Responsive Web Design:** Ensuring that Trillo looks great on any device, from mobile to desktop.
- **SASS**: Utilizing SASS for more efficient and organized CSS.
This project is inspired by the exceptional teaching of Jonas Schmedtmann, whose courses have been instrumental in my growth as a web developer.
## 💻 Installation and Setup
To run Nexter on your local machine, follow these steps:
1. **Clone the Repository**
```bash
git clone https://github.com/PratikAgarwalla/trillo.git
cd trillo
```
2. **Install Dependencies**
Make sure you have Node.js installed. Then, install the required npm packages:
```bash
npm install
```
3. **Start Development Server**
To start the development server and view Trillo in action, run:
```bash
npm start
```
This command will:
- Start a local development server using live-server.
- for changes in your files and automatically reload the browser.
4. **Explore the Project**
Open the project in your browser and enjoy the fully responsive, elegant design of Trillo. Whether you’re booking a car, flight, or tour, Trillo offers a seamless user experience.
## 🔧 Build Process
To prepare the project for production, follow these steps:
Compile SASS and Optimize CSS
```bash
npm run build-css
```
This command will:
- Compile the main SASS file into CSS.
- Concatenate the compiled CSS with other CSS files.
- Add vendor prefixes using Autoprefixer.
- Minify the final CSS file for optimized performance.
## 🛠️ Technologies Used
- **HTML5**
- **CSS3**
- **SASS**
- **Grid Layout**
- **Responsive Web Design**
## 🎨 Credits
Built by **Pratik Agarwalla** as part of his web development journey. Full credit and immense gratitude go to Jonas Schmedtmann for his unparalleled teaching and resources. His guidance has been invaluable in the creation of Nexter. I highly recommend checking out his course, [Advanced CSS and SASS](https://www.udemy.com/share/101Wkw3@X1Bq7xbD-pL_r-v4ZtkdcInX6pgfwbGok6S8gNZg5Cl4FW4kV6Xzl1BXGW0-HkuXKQ==/), for anyone looking to elevate their web development skills.