diff --git a/PrésentationSession1_06022025.pptx b/PrésentationSession1_06022025.pptx new file mode 100644 index 0000000..44173cc Binary files /dev/null and b/PrésentationSession1_06022025.pptx differ diff --git a/README.md b/README.md index 76d79df..e69de29 100644 --- a/README.md +++ b/README.md @@ -1,59 +0,0 @@ -# Angular - -This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 19.1.6. - -## Development server - -To start a local development server, run: - -```bash -ng serve -``` - -Once the server is running, open your browser and navigate to `http://localhost/`. The application will automatically reload whenever you modify any of the source files. - -## Code scaffolding - -Angular CLI includes powerful code scaffolding tools. To generate a new component, run: - -```bash -ng generate component component-name -``` - -For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run: - -```bash -ng generate --help -``` - -## Building - -To build the project run: - -```bash -ng build -``` - -This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed. - -## Running unit tests - -To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command: - -```bash -ng test -``` - -## Running end-to-end tests - -For end-to-end (e2e) testing, run: - -```bash -ng e2e -``` - -Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs. - -## Additional Resources - -For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page. diff --git a/.editorconfig b/angular/.editorconfig similarity index 100% rename from .editorconfig rename to angular/.editorconfig diff --git a/.gitignore b/angular/.gitignore similarity index 100% rename from .gitignore rename to angular/.gitignore diff --git a/.vscode/extensions.json b/angular/.vscode/extensions.json similarity index 100% rename from .vscode/extensions.json rename to angular/.vscode/extensions.json diff --git a/.vscode/launch.json b/angular/.vscode/launch.json similarity index 100% rename from .vscode/launch.json rename to angular/.vscode/launch.json diff --git a/.vscode/tasks.json b/angular/.vscode/tasks.json similarity index 100% rename from .vscode/tasks.json rename to angular/.vscode/tasks.json diff --git a/angular/README.md b/angular/README.md new file mode 100644 index 0000000..52a4e60 --- /dev/null +++ b/angular/README.md @@ -0,0 +1,59 @@ +# Angular + +This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 19.1.6. + +## Development server + +To start a local development server, run: + +```bash +ng serve +``` + +Once the server is running, open your browser and navigate to `http://localhost:4200/`. The application will automatically reload whenever you modify any of the source files. + +## Code scaffolding + +Angular CLI includes powerful code scaffolding tools. To generate a new component, run: + +```bash +ng generate component component-name +``` + +For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run: + +```bash +ng generate --help +``` + +## Building + +To build the project run: + +```bash +ng build +``` + +This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed. + +## Running unit tests + +To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command: + +```bash +ng test +``` + +## Running end-to-end tests + +For end-to-end (e2e) testing, run: + +```bash +ng e2e +``` + +Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs. + +## Additional Resources + +For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page. diff --git a/angular.json b/angular/angular.json similarity index 96% rename from angular.json rename to angular/angular.json index 893c76f..a87b644 100644 --- a/angular.json +++ b/angular/angular.json @@ -40,9 +40,7 @@ "src/styles.css", "node_modules/bootstrap/dist/css/bootstrap.min.css" ], - "scripts": [ - "node_modules/bootstrap/dist/js/bootstrap.bundle.min.js" - ] + "scripts": [] }, "configurations": { "production": { diff --git a/package-lock.json b/angular/package-lock.json similarity index 100% rename from package-lock.json rename to angular/package-lock.json diff --git a/package.json b/angular/package.json similarity index 100% rename from package.json rename to angular/package.json diff --git a/public/favicon.ico b/angular/public/favicon.ico similarity index 100% rename from public/favicon.ico rename to angular/public/favicon.ico diff --git a/src/app/about/about.component.css b/angular/src/app/about/about.component.css similarity index 100% rename from src/app/about/about.component.css rename to angular/src/app/about/about.component.css diff --git a/angular/src/app/about/about.component.html b/angular/src/app/about/about.component.html new file mode 100644 index 0000000..86a08c7 --- /dev/null +++ b/angular/src/app/about/about.component.html @@ -0,0 +1,37 @@ +
+ + + + +
+
+ Message + + +
+
+ + +
+

Liste des commentaires

+
    +
  1. +
    +
    {{ comment.message }}
    +
    + + {{ comment.date | date:'dd/MM/yyyy' }} +
    2. +
+
+ + + +

Aucun commentaire pour le moment

+ +
diff --git a/src/app/about/about.component.spec.ts b/angular/src/app/about/about.component.spec.ts similarity index 100% rename from src/app/about/about.component.spec.ts rename to angular/src/app/about/about.component.spec.ts diff --git a/angular/src/app/about/about.component.ts b/angular/src/app/about/about.component.ts new file mode 100644 index 0000000..d9193b1 --- /dev/null +++ b/angular/src/app/about/about.component.ts @@ -0,0 +1,42 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-about', + standalone: false, + templateUrl: './about.component.html', + styleUrl: './about.component.css' +}) + +export class AboutComponent implements OnInit { + + info: Info = new Info(); + comments: Array = []; + comment: Comment = new Comment(); + newComment: boolean = false; + + constructor() {} + + ngOnInit(): void {} + + addComment() { + if (this.comment.message) { + this.comment.date = new Date(); + this.comments.push({ + message: this.comment.message, + date: this.comment.date + }); + this.comment.message = ''; + } + } +} + +export class Info { + name: string = "Test"; + email: string = "test@mail.com"; + phone: string= "000000000"; +} + +export class Comment { + message: string = ''; + date: Date | null = null; +} diff --git a/src/app/account/account.component.css b/angular/src/app/account/account.component.css similarity index 100% rename from src/app/account/account.component.css rename to angular/src/app/account/account.component.css diff --git a/src/app/account/account.component.html b/angular/src/app/account/account.component.html similarity index 87% rename from src/app/account/account.component.html rename to angular/src/app/account/account.component.html index f61c57d..1a8e57f 100644 --- a/src/app/account/account.component.html +++ b/angular/src/app/account/account.component.html @@ -77,17 +77,12 @@ - -
- - - + + +
diff --git a/src/app/account/account.component.spec.ts b/angular/src/app/account/account.component.spec.ts similarity index 100% rename from src/app/account/account.component.spec.ts rename to angular/src/app/account/account.component.spec.ts diff --git a/src/app/account/account.component.ts b/angular/src/app/account/account.component.ts similarity index 74% rename from src/app/account/account.component.ts rename to angular/src/app/account/account.component.ts index 5125f94..f75e8ac 100644 --- a/src/app/account/account.component.ts +++ b/angular/src/app/account/account.component.ts @@ -1,6 +1,5 @@ import { Component } from '@angular/core'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; -import { InfoService } from '../services/info.service'; @Component({ selector: 'app-account', @@ -13,21 +12,22 @@ export class AccountComponent { infoForm: FormGroup; infos: any[] = []; - constructor(private fb: FormBuilder, private infoService: InfoService) { + constructor(private fb: FormBuilder) { this.infoForm = this.fb.group({ gender: ['', Validators.required], nameLast: ['', [Validators.required, Validators.minLength(3)]], nameFirst: ['', [Validators.required, Validators.minLength(3)]], email: ['', [Validators.required, Validators.pattern(/^[a-zA-Z0-9._%+-]+$/)]], address: ['', [Validators.required, Validators.minLength(10)]], - codePostal: ['', [Validators.required, Validators.minLength(4), Validators.pattern(/^\d+$/)]], + codePostal: ['', [Validators.required, Validators.minLength(4), Validators.pattern(/^\d{4,}$/)]], }); } addInfo() { if (this.infoForm.valid) { const formData = this.infoForm.value; - + + // Ajouter @edu.igensia.com automatiquement const email = formData.email.toLowerCase(); const fullEmail = `${email}@edu.igensia.com`; const nameLast = formData.nameLast.toUpperCase(); @@ -35,15 +35,14 @@ export class AccountComponent { const newInfo = { ...formData, - nameLast: nameLast, - nameFirst: nameFirst, - email: fullEmail, - date: new Date() + nameLast: nameLast, // Mettre l'email complet + nameFirst: nameFirst, // Mettre l'email complet + email: fullEmail, // Mettre l'email complet + date: new Date() // Ajoute la date actuelle }; this.infos.push(newInfo); - this.infoService.addInfo(newInfo); - this.infoForm.reset(); + this.infoForm.reset(); // Réinitialise le formulaire après l'ajout } } } diff --git a/src/app/app-routing.module.ts b/angular/src/app/app-routing.module.ts similarity index 85% rename from src/app/app-routing.module.ts rename to angular/src/app/app-routing.module.ts index fda40d9..09f67a5 100644 --- a/src/app/app-routing.module.ts +++ b/angular/src/app/app-routing.module.ts @@ -2,14 +2,12 @@ import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; import { HomeComponent } from './home/home.component'; import { AboutComponent } from './about/about.component'; -import { InfoComponent } from './info/info.component'; import { ContactsComponent } from './contacts/contacts.component'; const routes: Routes = [ { path: '', component: HomeComponent }, { path: 'home', component: HomeComponent }, { path: 'about', component: AboutComponent }, - { path: 'info', component: InfoComponent }, { path: 'contacts', component: ContactsComponent }, ]; diff --git a/src/app/app.component.css b/angular/src/app/app.component.css similarity index 100% rename from src/app/app.component.css rename to angular/src/app/app.component.css diff --git a/src/app/app.component.html b/angular/src/app/app.component.html similarity index 100% rename from src/app/app.component.html rename to angular/src/app/app.component.html diff --git a/src/app/app.component.spec.ts b/angular/src/app/app.component.spec.ts similarity index 100% rename from src/app/app.component.spec.ts rename to angular/src/app/app.component.spec.ts diff --git a/src/app/app.component.ts b/angular/src/app/app.component.ts similarity index 100% rename from src/app/app.component.ts rename to angular/src/app/app.component.ts diff --git a/src/app/app.module.ts b/angular/src/app/app.module.ts similarity index 90% rename from src/app/app.module.ts rename to angular/src/app/app.module.ts index 0c639e7..a68d7b5 100644 --- a/src/app/app.module.ts +++ b/angular/src/app/app.module.ts @@ -9,7 +9,6 @@ import { ContactsComponent } from './contacts/contacts.component'; import { HomeComponent } from './home/home.component'; import { NavBarComponent } from './nav-bar/nav-bar.component'; import { AccountComponent } from './account/account.component'; -import { InfoComponent } from './info/info.component'; @NgModule({ declarations: [ @@ -18,8 +17,7 @@ import { InfoComponent } from './info/info.component'; ContactsComponent, HomeComponent, NavBarComponent, - AccountComponent, - InfoComponent + AccountComponent ], imports: [ BrowserModule, diff --git a/src/app/contacts/contacts.component.css b/angular/src/app/contacts/contacts.component.css similarity index 100% rename from src/app/contacts/contacts.component.css rename to angular/src/app/contacts/contacts.component.css diff --git a/src/app/contacts/contacts.component.html b/angular/src/app/contacts/contacts.component.html similarity index 100% rename from src/app/contacts/contacts.component.html rename to angular/src/app/contacts/contacts.component.html diff --git a/src/app/contacts/contacts.component.spec.ts b/angular/src/app/contacts/contacts.component.spec.ts similarity index 100% rename from src/app/contacts/contacts.component.spec.ts rename to angular/src/app/contacts/contacts.component.spec.ts diff --git a/src/app/contacts/contacts.component.ts b/angular/src/app/contacts/contacts.component.ts similarity index 100% rename from src/app/contacts/contacts.component.ts rename to angular/src/app/contacts/contacts.component.ts diff --git a/src/app/home/home.component.css b/angular/src/app/home/home.component.css similarity index 100% rename from src/app/home/home.component.css rename to angular/src/app/home/home.component.css diff --git a/src/app/home/home.component.html b/angular/src/app/home/home.component.html similarity index 100% rename from src/app/home/home.component.html rename to angular/src/app/home/home.component.html diff --git a/src/app/home/home.component.spec.ts b/angular/src/app/home/home.component.spec.ts similarity index 100% rename from src/app/home/home.component.spec.ts rename to angular/src/app/home/home.component.spec.ts diff --git a/src/app/home/home.component.ts b/angular/src/app/home/home.component.ts similarity index 100% rename from src/app/home/home.component.ts rename to angular/src/app/home/home.component.ts diff --git a/src/app/nav-bar/nav-bar.component.css b/angular/src/app/nav-bar/nav-bar.component.css similarity index 100% rename from src/app/nav-bar/nav-bar.component.css rename to angular/src/app/nav-bar/nav-bar.component.css diff --git a/src/app/nav-bar/nav-bar.component.html b/angular/src/app/nav-bar/nav-bar.component.html similarity index 87% rename from src/app/nav-bar/nav-bar.component.html rename to angular/src/app/nav-bar/nav-bar.component.html index 80dab51..c127a2e 100644 --- a/src/app/nav-bar/nav-bar.component.html +++ b/angular/src/app/nav-bar/nav-bar.component.html @@ -20,9 +20,6 @@
  • About
    • -
  • - Infos -
  • Contacts
    • diff --git a/src/app/nav-bar/nav-bar.component.spec.ts b/angular/src/app/nav-bar/nav-bar.component.spec.ts similarity index 100% rename from src/app/nav-bar/nav-bar.component.spec.ts rename to angular/src/app/nav-bar/nav-bar.component.spec.ts diff --git a/src/app/nav-bar/nav-bar.component.ts b/angular/src/app/nav-bar/nav-bar.component.ts similarity index 100% rename from src/app/nav-bar/nav-bar.component.ts rename to angular/src/app/nav-bar/nav-bar.component.ts diff --git a/src/index.html b/angular/src/index.html similarity index 100% rename from src/index.html rename to angular/src/index.html diff --git a/src/main.ts b/angular/src/main.ts similarity index 100% rename from src/main.ts rename to angular/src/main.ts diff --git a/src/styles.css b/angular/src/styles.css similarity index 100% rename from src/styles.css rename to angular/src/styles.css diff --git a/tsconfig.app.json b/angular/tsconfig.app.json similarity index 100% rename from tsconfig.app.json rename to angular/tsconfig.app.json diff --git a/tsconfig.json b/angular/tsconfig.json similarity index 100% rename from tsconfig.json rename to angular/tsconfig.json diff --git a/tsconfig.spec.json b/angular/tsconfig.spec.json similarity index 100% rename from tsconfig.spec.json rename to angular/tsconfig.spec.json diff --git a/formation_angular_session2_04032025.pptx b/formation_angular_session2_04032025.pptx new file mode 100644 index 0000000..6456d80 Binary files /dev/null and b/formation_angular_session2_04032025.pptx differ diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html deleted file mode 100644 index b191ce3..0000000 --- a/src/app/about/about.component.html +++ /dev/null @@ -1,68 +0,0 @@ -
    - - - - -
    -
    -
    - Message - - -
    -
    -
    - - -
    -

    Liste des commentaires

    -
    -
    -
    -
    {{ msg.user }}
    -
    {{ msg.message }}
    -
    - - {{ msg.date | date:'dd/MM/yyyy' }} - -
    -
    -
    -
    -
    -
    -
    -
    {{ msg.user }}
    -
    {{ msg.message }}
    -
    - - {{ msg.date | date:'dd/MM/yyyy' }} - -
    -
    -
    - - - -

    Aucun commentaire pour le moment

    -     -
    diff --git a/src/app/about/about.component.ts b/src/app/about/about.component.ts deleted file mode 100644 index b770537..0000000 --- a/src/app/about/about.component.ts +++ /dev/null @@ -1,72 +0,0 @@ -import { Component, OnInit } from '@angular/core'; -import { FormBuilder, FormGroup, Validators } from '@angular/forms'; -import { InfoService } from '../services/info.service'; -import { MessageService } from '../services/message.service'; - -@Component({ - selector: 'app-about', - standalone: false, - templateUrl: './about.component.html', - styleUrls: ['./about.component.css'] -}) - -export class AboutComponent implements OnInit { - messageForm: FormGroup; - - infos: Info[] = []; - info: Info = new Info(); - commentsAll: Comment[] = []; - - - comments: Comment[] = []; - comment: Comment = new Comment(); - newComment: boolean = false; - - constructor(private fb: FormBuilder, private infoService: InfoService, private messageService: MessageService) { - this.messageForm = this.fb.group({ - message: ['', [Validators.required, Validators.minLength(3)]], - }); - } - - ngOnInit() { - this.infos = this.infoService.getInfos(); - this.info = this.infos.length > 0 ? this.infos[this.infos.length - 1] : new Info(); - - this.commentsAll = this.messageService.getMessage().slice().reverse(); - this.comment = this.commentsAll.length > 0 ? this.commentsAll[0] : new Comment(); - } - - addComment() { - if (this.messageForm.valid) { - const formData = this.messageForm.value; - - const user = this.info.gender + this.info.nameLast + ' ' + this.info.nameFirst; - - const newComment = { - ...formData, - user: user, - date: new Date() - }; - - this.comments.push(newComment); - this.messageService.addMessage(newComment); - - this.messageForm.reset(); - } - } -} - -export class Info { - gender: string = 'Mister.'; - nameLast: string = 'Inconnu'; - nameFirst: string = 'PASLA'; - email: string = 'inconnu.pasla@edu.igensia.com'; - address: string = '0 rue d\'inconnu'; - codePostal: number = 1234; -} - -export class Comment { - user: string = ''; - message: string = ''; - date: Date | null = null; -} diff --git a/src/app/info/info.component.css b/src/app/info/info.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/src/app/info/info.component.html b/src/app/info/info.component.html deleted file mode 100644 index 404172c..0000000 --- a/src/app/info/info.component.html +++ /dev/null @@ -1,14 +0,0 @@ -
    - - -
    \ No newline at end of file diff --git a/src/app/info/info.component.spec.ts b/src/app/info/info.component.spec.ts deleted file mode 100644 index 759896e..0000000 --- a/src/app/info/info.component.spec.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { InfoComponent } from './info.component'; - -describe('InfoComponent', () => { - let component: InfoComponent; - let fixture: ComponentFixture; - - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [InfoComponent] - }) - .compileComponents(); - - fixture = TestBed.createComponent(InfoComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/info/info.component.ts b/src/app/info/info.component.ts deleted file mode 100644 index a7f7af3..0000000 --- a/src/app/info/info.component.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { Component } from '@angular/core'; -import { InfoService } from '../services/info.service'; - -@Component({ - selector: 'app-info', - standalone: false, - templateUrl: './info.component.html', - styleUrl: './info.component.css' -}) -export class InfoComponent { - infos: any[] = []; - - constructor(private infoService: InfoService) {} - - ngOnInit() { - this.infos = this.infoService.getInfos().slice().reverse(); - } -} diff --git a/src/app/services/info.service.spec.ts b/src/app/services/info.service.spec.ts deleted file mode 100644 index 0b18632..0000000 --- a/src/app/services/info.service.spec.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { TestBed } from '@angular/core/testing'; - -import { InfoService } from './info.service'; - -describe('InfoService', () => { - let service: InfoService; - - beforeEach(() => { - TestBed.configureTestingModule({}); - service = TestBed.inject(InfoService); - }); - - it('should be created', () => { - expect(service).toBeTruthy(); - }); -}); diff --git a/src/app/services/info.service.ts b/src/app/services/info.service.ts deleted file mode 100644 index 316bbcd..0000000 --- a/src/app/services/info.service.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { Injectable } from '@angular/core'; - -@Injectable({ - providedIn: 'root' -}) -export class InfoService { - private infos: any[] = []; - - constructor() { } - - // Ajouter une info - addInfo(info: any) { - this.infos.push(info); - } - - // Récupérer toutes les infos - getInfos() { - return this.infos; - } -} diff --git a/src/app/services/message.service.spec.ts b/src/app/services/message.service.spec.ts deleted file mode 100644 index 1db761b..0000000 --- a/src/app/services/message.service.spec.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { TestBed } from '@angular/core/testing'; - -import { MessageService } from './message.service'; - -describe('MessageService', () => { - let service: MessageService; - - beforeEach(() => { - TestBed.configureTestingModule({}); - service = TestBed.inject(MessageService); - }); - - it('should be created', () => { - expect(service).toBeTruthy(); - }); -}); diff --git a/src/app/services/message.service.ts b/src/app/services/message.service.ts deleted file mode 100644 index df2ffe6..0000000 --- a/src/app/services/message.service.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { Injectable } from '@angular/core'; - -@Injectable({ - providedIn: 'root' -}) -export class MessageService { - private messages: any[] = []; - - constructor() { } - - // Ajouter une info - addMessage(message: any) { - this.messages.push(message); - } - - // Récupérer toutes les infos - getMessage() { - return this.messages; - } -}