<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Archives des JQuery - Fatz Studios</title>
	<atom:link href="https://fatz-studios.com/portfolio-category/jquery/feed/" rel="self" type="application/rss+xml" />
	<link>https://fatz-studios.com/portfolio-category/jquery/</link>
	<description>From A to Z</description>
	<lastBuildDate>Thu, 15 Feb 2024 11:20:21 +0000</lastBuildDate>
	<language>fr-FR</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	

<image>
	<url>https://fatz-studios.com/wp-content/uploads/2020/05/logo_fs_mini.png</url>
	<title>Archives des JQuery - Fatz Studios</title>
	<link>https://fatz-studios.com/portfolio-category/jquery/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Set &#038; Match</title>
		<link>https://fatz-studios.com/portfolio/set-et-match/?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=set-et-match</link>
		
		<dc:creator><![CDATA[Aziz]]></dc:creator>
		<pubDate>Sun, 17 Jan 2021 13:27:25 +0000</pubDate>
				<guid isPermaLink="false">https://fatz-studios.com/?post_type=rara-portfolio&#038;p=1251</guid>

					<description><![CDATA[<p>Visitez Set &#38; Match</p>
<p>L’article <a href="https://fatz-studios.com/portfolio/set-et-match/">Set &#038; Match</a> est apparu en premier sur <a href="https://fatz-studios.com">Fatz Studios</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p style="text-align: center;"><a href="https://set-match.fatz-studios.com/" target="_blank" rel="noopener noreferrer"><button class="btn btn-secondary" type="button">Visitez Set &amp; Match</button></a></p>


<div class="wp-block-pb-accordion-item c-accordion__item js-accordion-item no-js" data-initially-open="false" data-click-to-close="true" data-auto-close="true" data-scroll="false" data-scroll-offset="0"><h2 id="at-12510" class="c-accordion__title js-accordion-controller" role="button">Quelles cibles pour Set &amp; Match ?</h2><div id="ac-12510" class="c-accordion__content">
<p>L&rsquo;application <strong><span class="has-inline-color has-luminous-vivid-orange-color">Set &amp; Match</span></strong> est née pour mettre en relation joueuses et joueurs de tennis avec des coachs.</p>



<p>Cela, dans l&rsquo;optique de préparer un tournoi, ou améliorer un aspect précis (d&rsquo;ordre technique, physique ou mental).</p>



<p>NDA: La fonctionnalité pour l&rsquo;inscription a été volontairement désactivée. L&rsquo;application n&rsquo;a pas vocation pour l&rsquo;instant à accueillir des utilisateurs, c&rsquo;est un test <img src="https://s.w.org/images/core/emoji/14.0.0/72x72/1f609.png" alt="😉" class="wp-smiley" style="height: 1em; max-height: 1em;" />. Tout n&rsquo;est pas encore en place, notamment l&rsquo;aspect juridique, collecte de données etc&#8230;</p>
</div></div>



<div class="wp-block-pb-accordion-item c-accordion__item js-accordion-item no-js" data-initially-open="false" data-click-to-close="true" data-auto-close="true" data-scroll="false" data-scroll-offset="0"><h2 id="at-12511" class="c-accordion__title js-accordion-controller" role="button">Un système de recherche</h2><div id="ac-12511" class="c-accordion__content">
<p>En plus d&rsquo;un profil public détaillé consultable, <strong><span class="has-inline-color has-luminous-vivid-orange-color">Set &amp; Match</span></strong> met a la disposition de ses utilisateurs un système de recherche simple et efficace.</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img fetchpriority="high" decoding="async" width="644" height="500" src="https://fatz-studios.com/wp-content/uploads/2024/01/search-filter_sm.webp" alt="Interface résultat de recherche sur le site Set &amp; Match, filtrant selon la recherche" class="wp-image-1496" srcset="https://fatz-studios.com/wp-content/uploads/2024/01/search-filter_sm.webp 644w, https://fatz-studios.com/wp-content/uploads/2024/01/search-filter_sm-300x233.webp 300w, https://fatz-studios.com/wp-content/uploads/2024/01/search-filter_sm-77x60.webp 77w" sizes="(max-width: 644px) 100vw, 644px" /></figure></div>


<p>Une barre de recherche par mots clés, pour cibler une spécialité recherchée, un budget équivalent etc&#8230;</p>



<p>Il sera aussi possible de rechercher par dates de disponibilités. Ces dernières seront liées à un lieu particulier, par exemple, du 02/03/2021 au 10/03/2021 à Londres.</p>
</div></div>



<div class="wp-block-pb-accordion-item c-accordion__item js-accordion-item no-js" data-initially-open="false" data-click-to-close="true" data-auto-close="true" data-scroll="false" data-scroll-offset="0"><h2 id="at-12512" class="c-accordion__title js-accordion-controller" role="button">Les technos utilisées</h2><div id="ac-12512" class="c-accordion__content">
<p>L&rsquo;application <strong><span class="has-inline-color has-luminous-vivid-orange-color">Set &amp; Match</span></strong> est bâtie sur les frameworks <strong><a href="https://symfony.com/blog/symfony-4-4-0-released" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">Symfony 4.4</span></a></strong> et <strong><a href="https://getbootstrap.com/" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">Bootstrap 4.5</span></a></strong>.</p>



<p>Pour que l&rsquo;utilisateur puisse télécharger son portrait, j&rsquo;ai installé le <strong><a href="https://packagist.org/packages/vich/uploader-bundle" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">Vich-uploader Bundle</span></a></strong>.</p>



<p>J&rsquo;ai aussi utilisé le plugin <strong><a href="https://fr.wikipedia.org/wiki/DataTables" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">DataTables</span></a></strong> en <strong><a href="https://jquery.com/" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">JQuery</span></a></strong> pour le <strong><a href="https://fr.wikipedia.org/wiki/CRUD" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">CRUD</span></a></strong> dans l&rsquo;onglet d&rsquo;administration.</p>



<p>Très pratique pour son système de pagination, sa barre de recherche et autres filtres intégrés.</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img decoding="async" width="644" height="618" src="https://fatz-studios.com/wp-content/uploads/2024/01/admin_user_sm.webp" alt="L'interface d'administration des utilisateurs du site Set &amp; Match.Le plugin DataTables en Jquery pour générer le tableau dynamique de gestion" class="wp-image-1494" srcset="https://fatz-studios.com/wp-content/uploads/2024/01/admin_user_sm.webp 644w, https://fatz-studios.com/wp-content/uploads/2024/01/admin_user_sm-300x288.webp 300w, https://fatz-studios.com/wp-content/uploads/2024/01/admin_user_sm-63x60.webp 63w" sizes="(max-width: 644px) 100vw, 644px" /></figure></div></div></div>



<div class="wp-block-pb-accordion-item c-accordion__item js-accordion-item no-js" data-initially-open="false" data-click-to-close="true" data-auto-close="true" data-scroll="false" data-scroll-offset="0"><h2 id="at-12513" class="c-accordion__title js-accordion-controller" role="button">La base de données de Set &amp; Match</h2><div id="ac-12513" class="c-accordion__content">
<p>Une base de données avec une table principale, User, autour de laquelle gravitent les autres (en <strong><a href="https://symfony.com/doc/current/doctrine/associations.html" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">relations ManyToMany ou OneToMany</span></a></strong>).</p>



<p>J&rsquo;ai aussi indexé divers champs, les plus pertinents, pour accélérer la recherche par mots clés.</p>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img decoding="async" width="644" height="348" src="https://fatz-studios.com/wp-content/uploads/2024/01/concepteur_bdd_sm.webp" alt="Concepteur de la base de données du site set &amp; Match, codé avec le framework Symfony" class="wp-image-1493" srcset="https://fatz-studios.com/wp-content/uploads/2024/01/concepteur_bdd_sm.webp 644w, https://fatz-studios.com/wp-content/uploads/2024/01/concepteur_bdd_sm-300x162.webp 300w, https://fatz-studios.com/wp-content/uploads/2024/01/concepteur_bdd_sm-111x60.webp 111w" sizes="(max-width: 644px) 100vw, 644px" /></figure></div></div></div>



<div class="wp-block-pb-accordion-item c-accordion__item js-accordion-item no-js" data-initially-open="false" data-click-to-close="true" data-auto-close="true" data-scroll="false" data-scroll-offset="0"><h2 id="at-12514" class="c-accordion__title js-accordion-controller" role="button">Une application optimisée</h2><div id="ac-12514" class="c-accordion__content">
<p>Pour le référencement naturel, j&rsquo;ai soigné les balises &lt;title&gt;, cibler les mots clés avec &lt;strong&gt;, le heading, l&rsquo;attribut alt de la balise &lt;img&gt;.</p>



<p>J&rsquo;ai aussi été attentif a bien renseigner les différentes &lt;metaDescription&gt;, choisir <strong><a href="https://fr.wikipedia.org/wiki/WebP" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">le format .webp</span></a></strong> pour les images et ajouter l&rsquo;attribut loading= »lazy » toujours pour la balise &lt;img&gt;</p>



<p>Tout ce travail ayant pour but d&rsquo;améliorer le chargement des pages, et donc le <strong><a href="https://www.seo.fr/definition/seo-definition" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">SEO</span></a></strong></p>
</div></div>



<div class="wp-block-pb-accordion-item c-accordion__item js-accordion-item no-js" data-initially-open="false" data-click-to-close="true" data-auto-close="true" data-scroll="false" data-scroll-offset="0"><h2 id="at-12515" class="c-accordion__title js-accordion-controller" role="button">Le résultat de l&rsquo;optimisation</h2><div id="ac-12515" class="c-accordion__content">
<p>Et toutes ces <strong><a href="https://fatz-studios.com/portfolio/stage-pour-optimiser-le-site-wexample/"><span class="has-inline-color has-vivid-cyan-blue-color">techniques</span></a></strong>, apprises notamment chez <strong><a href="https://wexample.com/" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">Wexample</span></a></strong>, ont donné de bons résultats, en performances pures comme en éco-conception.</p>



<h3 class="wp-block-heading"><strong><a href="https://addons.mozilla.org/fr/firefox/addon/greenit-analysis/" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">GreenIt Analysis</span></a></strong> (plugin Mozilla et Chrome)</h3>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="368" height="365" src="https://fatz-studios.com/wp-content/uploads/2024/01/score_greenIt_sm.webp" alt="Résultat de l'audit concernant la page d'accueil du site Set &amp; Match, score réalisé auprès de l'extension web Green It Analysis" class="wp-image-1497" srcset="https://fatz-studios.com/wp-content/uploads/2024/01/score_greenIt_sm.webp 368w, https://fatz-studios.com/wp-content/uploads/2024/01/score_greenIt_sm-300x298.webp 300w, https://fatz-studios.com/wp-content/uploads/2024/01/score_greenIt_sm-150x150.webp 150w, https://fatz-studios.com/wp-content/uploads/2024/01/score_greenIt_sm-60x60.webp 60w" sizes="(max-width: 368px) 100vw, 368px" /></figure></div>


<h3 class="wp-block-heading"><strong><a href="https://ecograder.com/" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">Ecograder</span></a></strong></h3>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="925" height="500" src="https://fatz-studios.com/wp-content/uploads/2024/01/score_ecograder_sm.webp" alt="Résultat de l'audit concernant la page d'accueil du site Set &amp; Match, score réalisé auprès du site Ecograder" class="wp-image-1498" srcset="https://fatz-studios.com/wp-content/uploads/2024/01/score_ecograder_sm.webp 925w, https://fatz-studios.com/wp-content/uploads/2024/01/score_ecograder_sm-300x162.webp 300w, https://fatz-studios.com/wp-content/uploads/2024/01/score_ecograder_sm-768x415.webp 768w, https://fatz-studios.com/wp-content/uploads/2024/01/score_ecograder_sm-111x60.webp 111w" sizes="(max-width: 925px) 100vw, 925px" /></figure></div>


<h3 class="wp-block-heading"><strong><a href="https://www.websitecarbon.com/" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">Website Carbon</span></a></strong></h3>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="925" height="500" src="https://fatz-studios.com/wp-content/uploads/2024/01/score_websiteCarbon_sm.webp" alt="Résultat de l'audit concernant la page d'accueil du site Set &amp; Match, score réalisé auprès du site Website Carbon" class="wp-image-1499" srcset="https://fatz-studios.com/wp-content/uploads/2024/01/score_websiteCarbon_sm.webp 925w, https://fatz-studios.com/wp-content/uploads/2024/01/score_websiteCarbon_sm-300x162.webp 300w, https://fatz-studios.com/wp-content/uploads/2024/01/score_websiteCarbon_sm-768x415.webp 768w, https://fatz-studios.com/wp-content/uploads/2024/01/score_websiteCarbon_sm-111x60.webp 111w" sizes="(max-width: 925px) 100vw, 925px" /></figure></div>


<h3 class="wp-block-heading"><strong><a href="https://developers.google.com/speed/pagespeed/insights/?hl=fr" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">PageSpeed Insights</span></a></strong></h3>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="925" height="500" src="https://fatz-studios.com/wp-content/uploads/2024/01/score_pageSpeedInsight_sm.webp" alt="Résultat de l'audit concernant la page d'accueil du site Set &amp; Match, score réalisé auprès du site PageSpeed Insights" class="wp-image-1500" srcset="https://fatz-studios.com/wp-content/uploads/2024/01/score_pageSpeedInsight_sm.webp 925w, https://fatz-studios.com/wp-content/uploads/2024/01/score_pageSpeedInsight_sm-300x162.webp 300w, https://fatz-studios.com/wp-content/uploads/2024/01/score_pageSpeedInsight_sm-768x415.webp 768w, https://fatz-studios.com/wp-content/uploads/2024/01/score_pageSpeedInsight_sm-111x60.webp 111w" sizes="(max-width: 925px) 100vw, 925px" /></figure></div>


<h3 class="wp-block-heading"><strong><a href="https://gtmetrix.com/" target="_blank" rel="noreferrer noopener"><span class="has-inline-color has-vivid-cyan-blue-color">GTmetrix</span></a></strong></h3>


<div class="wp-block-image">
<figure class="aligncenter size-full"><img loading="lazy" decoding="async" width="925" height="500" src="https://fatz-studios.com/wp-content/uploads/2024/01/score_gtmetrix_sm.webp" alt="Résultat de l'audit concernant la page d'accueil du site Set &amp; Match, score obtenu auprès du site GTmetrix" class="wp-image-1501" srcset="https://fatz-studios.com/wp-content/uploads/2024/01/score_gtmetrix_sm.webp 925w, https://fatz-studios.com/wp-content/uploads/2024/01/score_gtmetrix_sm-300x162.webp 300w, https://fatz-studios.com/wp-content/uploads/2024/01/score_gtmetrix_sm-768x415.webp 768w, https://fatz-studios.com/wp-content/uploads/2024/01/score_gtmetrix_sm-111x60.webp 111w" sizes="(max-width: 925px) 100vw, 925px" /></figure></div></div></div>



<p></p>
<p>L’article <a href="https://fatz-studios.com/portfolio/set-et-match/">Set &#038; Match</a> est apparu en premier sur <a href="https://fatz-studios.com">Fatz Studios</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>MW Radio</title>
		<link>https://fatz-studios.com/portfolio/mw-radio-php-sql/?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=mw-radio-php-sql</link>
		
		<dc:creator><![CDATA[Aziz]]></dc:creator>
		<pubDate>Thu, 21 May 2020 08:15:00 +0000</pubDate>
				<guid isPermaLink="false">http://demo.rarathemes.com/elegant-portfolio/?post_type=rara-portfolio&#038;p=37</guid>

					<description><![CDATA[<p>Web Radio entièrement Responsive (Bootstrap) Codé en PHP + intégration de JS + Plugin JQuery Back Office pour gérer les contenus Lecteur JS qui sélectionne la Playlist en aléatoire Navigation interne pour écouter les morceaux de la Playlist (presque 600 tracks) de manière individuelle Plugin JQuery DataTables pour la pagination du Back Office Barre de &#8230; </p>
<p>L’article <a href="https://fatz-studios.com/portfolio/mw-radio-php-sql/">MW Radio</a> est apparu en premier sur <a href="https://fatz-studios.com">Fatz Studios</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p style="text-align: center;">Web Radio entièrement Responsive (<strong>Bootstrap</strong>)<br />
Codé en <strong>PHP</strong> + intégration de <strong>JS</strong><br />
+ Plugin <strong>JQuery</strong><br />
<strong>Back Office</strong> pour gérer les contenus</p>
<p style="text-align: center;">
Lecteur <strong>JS</strong> qui sélectionne la Playlist en aléatoire<br />
Navigation interne pour écouter les morceaux de la Playlist (presque 600 tracks) de manière individuelle</p>
<p style="text-align: center;">
<strong>Plugin JQuery DataTables</strong><br />
pour la pagination du Back Office<br />
Barre de recherche pour filtrer:<br />
– Les albums par année<br />
– Les musiciens<br />
– Les styles musicaux, etc…</p>
<p style="text-align: center;">
<strong>Zone de commentaire</strong> pour les utilisateurs<br />
sous chaque Player Mp3</p>
<p>L’article <a href="https://fatz-studios.com/portfolio/mw-radio-php-sql/">MW Radio</a> est apparu en premier sur <a href="https://fatz-studios.com">Fatz Studios</a>.</p>
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
