Symfony UX Autocompleteとかいう 顧客が本当に必要だったもの

PHPerのための「Symfonyを語り合う」PHP TechCafe のLT資料です。
https://rakus.connpass.com/event/285602/

同様の内容をブログ記事としても公開済みです。
https://zenn.dev/ttskch/articles/dc3c09b71f73d4

Transcript

1. / 29 Symfony UX Autocomplete 
 2 023 / 06 / 2 7 #PHPTechCafe @ttskch 1
2. Kannade PHP 11 Zenn Symfony 
 @ttskch
3. / 29 symfony/form 3 FormType ⾒ TextType TextareaType ChoiceType EntityType 

4. / 29 DB EntityType 4
5. / 29 $builder ->add('user', EntityType::class, [ 'class' => User::class, 'placeholder' => 'બ୒͍ͯͩ͘͠͞', ]) ; 5 EntityType
6. / 29 EntityType 6
7. / 29 EntityType 7
8. / 29 EntityType N+ 1 8 __toString() ⾒ N+ 1
9. / 29 class User { // ... public function __toString(): string { return sprintf('%s %s', $this->team, $this->name); } } 9 EntityType N+ 1
10. / 29 EntityType N+ 1 10
11. / 29 EntityType N+ 1 11 User
12. / 29 Doctrine 
 Doctrine JOIN 
 EntityType N+ 1 12
13. / 29 13 EntityType JOIN
14. / 29 $builder ->add('user', EntityType::class, [ 'class' => User::class, 'placeholder' => 'બ୒͍ͯͩ͘͠͞', 'query_builder' => function (UserRepository $repository) { return $repository->createQueryBuilder('u') ->leftJoin('u.team', 't') ->addSelect('t') ; }, ]) ; 14
15. / 29 15 1 🙆
16. / 29 16 N+ 1 <select> Select 2 selectize.js JavaScript 
 ⾒ 

17. / 29 17 Symfony UX Autocomplete
18. / 29 Symfony UX 18 PHP JavaScript Symfony UI
19. / 29 Symfony UX Autocomplete 19 Symfony UX 1 EntityType ChoiceType <select> 

20. / 29 Symfony UX Autocomplete 20 Symfony UX 1 EntityType ChoiceType <select> 

21. / 29 #[AsEntityAutocompleteField] class UserAutocompleteField extends AbstractType { public function configureOptions(OptionsResolver $resolver): void { $resolver->setDefaults([ 'class' => User::class, 'placeholder' => 'ݕࡧ͍ͯͩ͘͠͞', ]); } public function getParent(): string { return ParentEntityAutocompleteType::class; } } 21 🙏 FormType
22. / 29 $builder ->add('user', UserAutocompleteField::class) ; 22 🙏 🙆
23. / 29 23 💡
24. / 29 24
25. / 29 25 User API Symfony UX Autocomplete 
 API
26. / 29 26 JavaScript Tom Select Tom Select FormType ⾒ JavaScript 
 Tom Select 
 🙏
27. / 29 27 Symfony UX Autocomplete Symfony UI 
 <select> N+ 1 Autocomplete 
 N+ 1 10 

28. / 29 🐙 28 https://github.com/ ttskch/symfony-ux-autocomplete-example
29. / 29 29 Thanks! @ttskch