import React, { useState } from 'react'; import { Button } from "/components/ui/button"; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "/components/ui/card"; import { Input } from "/components/ui/input"; import { Label } from "/components/ui/label"; import { Textarea } from "/components/ui/textarea"; import { Users, Award, Target, Code, Shield, Globe, Zap, Play, Mail, Phone, MapPin, Github, Linkedin, Twitter, Menu, X, ChevronRight, Calendar, Coffee, MessageCircle } from 'lucide-react'; interface FormData { name: string; email: string; programme: string; message: string; } const UM6PCollegeWebsite: React.FC = () => { const [isMenuOpen, setIsMenuOpen] = useState(false); const [formData, setFormData] = useState({ name: '', email: '', programme: '', message: '' }); const handleInputChange = (e: React.ChangeEvent) => { const { name, value } = e.target; setFormData(prev => ({ ...prev, [name]: value })); }; const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); console.log('Form submitted:', formData); // Handle form submission }; const scrollToSection = (sectionId: string) => { const element = document.getElementById(sectionId); if (element) { element.scrollIntoView({ behavior: 'smooth' }); } setIsMenuOpen(false); }; return (

{/* Header */}


              
                UM6P
                College of Computing


            
            {/* Desktop Navigation */}
            
              
              
              
              
              
            

            {/* Mobile Menu Button */}



          {/* Mobile Navigation */}
          {isMenuOpen && (
            
              
                
                
                
                
                
              
            
          )}



      {/* Hero Section */}
      
        
          
            
              Engineering Africa's
              Digital Future
            
            
              UM6P College of Computing empowers the next generation of computer scientists to build 
              solutions that matter. Through rigorous teaching, hands-on research, and an entrepreneurial 
              campus culture, we turn curiosity into code and impact.
            
            
            {/* Key Stats */}
            
              
                
                  
                
                600+
                Students
              
              
                
                  
                
                12
                Research Labs
              
              
                
                  
                
                25
                Venture-backed Start-ups
              
            

            
          
        
      

      {/* Programmes Section */}
      
        
          
            
              Programmes Snapshot
            
            
              Find the path that matches your ambition and schedule.
            
          

          
            
              
                
                  
                

                Engineering (Bac + 5)
                
                  Five-year programme blending theory, real-world projects, and co-op placements.
                
              
              
                
                  Graduate with a Master-level engineering degree and a head-start in global tech careers.
                
                
                  
                  5 Years
                
              
            

            
              
                
                  
                
                Executive Master
                
                  18-month, part-time track for working professionals.
                
              
              
                
                  Weekend + online sessions sharpen leadership and data skills without pausing your job.
                
                
                  
                  18 Months
                
              
            

            
              
                
                  
                
                PhD in Computer Science
                
                  Four-year doctorate driven by frontier research.
                
              
              
                
                  Work in a dedicated lab, publish internationally, and shape Africa's digital transformation.
                
                
                  
                  4 Years
                
              
            
          


          
            
          
        

      


      {/* Research Section */}
      
        
          
            
              Research & Innovation
            
            
              Breakthrough ideas happen where curiosity meets resources. Our researchers tackle African and 
              global challenges in AI, cybersecurity, and sustainable computing.
            
          

          
            
              
                
                  
                
                AI & Robotics Lab
              
              
                
                  Autonomous systems, computer vision, human-robot collaboration
                
              
            

            
              
                
                  
                
                Data Science & Sustainability Lab
              
              
                
                  Big-data analytics for agriculture, energy, climate resilience
                
              
            

            
              
                
                  
                
                Cybersecurity Center
              
              
                
                  Secure architectures, privacy, digital forensics for critical infrastructure
                
              
            

            
              
                
                  
                

                High-Performance Computing Hub
              
              
                
                  Scalable algorithms and cloud solutions powering pan-African research
                
              
            
          


          {/* Research Ticker */}
          
            
              Latest Research:
              GPU-efficient LLM
              •
              5G drone swarm
              •
              blockchain health records
            
          

          
            
          
        

      


      {/* Student Life Section */}
      
        
          
            
              Student Life in 60 Seconds
            
          

          
            
              
                Life at UM6P is equal parts code, community, and creativity. Join 15+ clubs—from AI Society 
                to esports—compete in 48-hour hackathons, intern with campus start-ups, and relax in eco-friendly 
                dorms overlooking Benguerir's innovation city.
              
              
                Career services connect you to 200 partner companies; wellness coaches keep you balanced.
              
              
                
                  "Here, I turned my capstone into a funded start-up."
                
                
                  — Salma, 3rd-year engineering student
                
              
              
            

            
              
                
                  
                
                15+
                Student Clubs
              
              
                
                  
                

                48h
                Hackathons
              

              
                
                  
                
                200
                Partner Companies
              
              
                
                  
                
                Eco
                Friendly Dorms
              
            

          

        

      


      {/* Contact Section */}
      
        
          
            
              Contact & Apply
            
            
              Ready to take the next step? Fill out the short form and our admissions team will reply within two business days.
            
          

          
            {/* Contact Form */}
            
              
                Application Form
              
              
                
                  
                    Name
                    
                  
                  
                    Email
                    
                  
                  
                    Programme of Interest
                    
                  
                  
                    Message
                                      </div>
                  <div className="flex flex-col sm:flex-row gap-4">
                    <Button 
                      type="submit" 
                      className="bg-orange-500 hover:bg-orange-600 text-white flex-1"
                    >
                      Apply Now
                    </Button>
                    <Button 
                      type="button" 
                      variant="outline" 
                      className="border-orange-500 text-orange-500 hover:bg-orange-500 hover:text-white flex-1"
                    >
                      Book Virtual Tour
                    </Button>
                  </div>
                </form>
              </CardContent>
            </Card>

            {/* Contact Information */}
            <div className="space-y-8">
              <Card className="bg-white border-2 border-gray-200">
                <CardHeader>
                  <CardTitle className="text-gray-900">Admissions Office</CardTitle>
                </CardHeader>
                <CardContent className="space-y-4">
                  <div className="flex items-center">
                    <Mail className="h-5 w-5 text-orange-500 mr-3" />
                    <span className="text-gray-700">admissions.cc@um6p.ma</span>
                  </div>
                  <div className="flex items-center">
                    <Phone className="h-5 w-5 text-orange-500 mr-3" />
                    <span className="text-gray-700">+212 5 24 00 00 00</span>
                  </div>
                  <div className="flex items-center">
                    <MapPin className="h-5 w-5 text-orange-500 mr-3" />
                    <span className="text-gray-700">Benguerir, Morocco</span>
                  </div>
                </CardContent>
              </Card>

              <Card className="bg-white border-2 border-gray-200">
                <CardHeader>
                  <CardTitle className="text-gray-900">Follow Us</CardTitle>
                </CardHeader>
                <CardContent>
                  <div className="flex space-x-4">
                    <Button variant="outline" size="sm" className="border-orange-500 text-orange-500 hover:bg-orange-500 hover:text-white">
                      <Linkedin className="h-4 w-4" />
                    </Button>
                    <Button variant="outline" size="sm" className="border-orange-500 text-orange-500 hover:bg-orange-500 hover:text-white">
                      <Twitter className="h-4 w-4" />
                    </Button>
                    <Button variant="outline" size="sm" className="border-orange-500 text-orange-500 hover:bg-orange-500 hover:text-white">
                      <Play className="h-4 w-4" />
                    </Button>
                  </div>
                </CardContent>
              </Card>
            </div>
          </div>
        </div>
      </section>

      {/* Footer */}
      <footer className="bg-gray-900 text-white py-8">
        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
          <div className="text-center">
            <p className="text-gray-400">
              © 2025 UM6P College of Computing
            </p>
          </div>
        </div>
      </footer>
    </div>
  );
};

export default UM6PCollegeWebsite;</article></body></html>

Engineering Africa's Digital Future

600+

12

25

Programmes Snapshot

Research & Innovation

Student Life in 60 Seconds

15+

48h

200

Eco

Contact & Apply