https://github.com/mirian97/civil-engineering-website-angular
https://github.com/mirian97/civil-engineering-website-angular
angular scss typescript
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/mirian97/civil-engineering-website-angular
- Owner: Mirian97
- License: mit
- Created: 2024-12-04T22:24:45.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2025-07-13T00:30:32.000Z (12 months ago)
- Last Synced: 2025-11-12T00:24:06.917Z (8 months ago)
- Topics: angular, scss, typescript
- Language: TypeScript
- Homepage: https://elio-rodrigues-ferreira-engenharia.vercel.app/
- Size: 15.3 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# 🏗️ Civil Engineering Website
A modern, responsive website showcasing the professional services of Civil Engineer Elio Rodrigues. Built with Angular 18 and featuring smooth animations, interactive components, and a professional design optimized for the construction industry.
## 🎯 About the Project
This website serves as a professional portfolio and business platform for Civil Engineer Elio Rodrigues, highlighting his expertise in structural engineering, construction management, and technical consulting services. The site features a modern, responsive design that effectively communicates professionalism and technical competence to potential clients.
### Key Highlights:
- **Professional Portfolio**: Showcases education, experience, and project gallery
- **Service Catalog**: Comprehensive list of civil engineering services
- **Contact Integration**: Direct communication channels for client inquiries
- **Responsive Design**: Optimized for all devices and screen sizes
- **Modern UI/UX**: Clean, professional interface with smooth animations
## 🛠️ Technologies Used
### Frontend Framework
- **Angular 18**: Latest version with standalone components
- **TypeScript**: Type-safe development
- **SCSS**: Advanced styling with variables and mixins
### UI/UX Libraries
- **Swiper.js**: Touch-enabled carousel/slider
- **Animate.css**: CSS animation library
- **SweetAlert2**: Beautiful alert and notification system
- **ngx-owl-carousel-o**: Angular carousel component
### Communication
- **EmailJS**: Client-side email functionality
- **@sweetalert2/ngx-sweetalert2**: Angular integration for alerts
### Development Tools
- **Angular CLI**: Development and build tools
- **Angular SSR**: Server-side rendering support
- **Karma & Jasmine**: Testing framework
## 🚀 Getting Started
### Prerequisites
- **Node.js** (v18 or higher)
- **npm** or **yarn** package manager
- **Angular CLI** (v18.1.3 or higher)
### Installation
1. **Clone the repository**
```bash
git clone https://github.com/Mirian97/civil-engineering-website-angular.git
cd civil-engineering-website-angular
```
2. **Install dependencies**
```bash
npm install
```
3. **Start development server**
```bash
npm start
```
4. **Open your browser**
Navigate to `http://localhost:4200/` to view the application.
## 💻 Development
### Component Development
The project uses Angular's standalone components for better modularity:
```bash
# Generate a new component
ng generate component components/component-name
# Generate a new service
ng generate service services/service-name
```
### Styling Guidelines
- Use SCSS variables for consistent theming
- Implement responsive design with mobile-first approach
- Use CSS custom properties for dynamic theming
## 📄 License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
---
**Built with ❤️ using Angular 18**