theoludwig/FunctionProject
theoludwig/FunctionProject
Archived
1
1
Fork 0
Code Pull Requests Actions Releases Activity

Hotfix et Modèle (backend) complet d'une fonction

Browse Source
This commit is contained in:
Divlo 2020-03-23 14:42:26 +01:00
parent 9d9aed8bcf
commit 96f18ead42
7 changed files with 42 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
api/controllers/functions.js
View File

@ -35,7 +35,10 @@ exports.getFunctions = (req, res, next) => {
},
include: [
{ model: Categories, attributes: ["name", "color"] }
]
],
attributes: {
exclude: ["updatedAt", "utilizationForm", "article", "isOnline"]
}
})
.then((result) => {
const { count, rows } = result;

16
api/models/functions.js
View File

@ -9,11 +9,11 @@ module.exports = sequelize.define('function', {
primaryKey: true
},
title: {
type: Sequelize.STRING(255),
type: Sequelize.STRING,
allowNull: false,
},
slug: {
type: Sequelize.STRING(255),
type: Sequelize.STRING,
allowNull: false,
},
description: {
@ -24,6 +24,18 @@ module.exports = sequelize.define('function', {
type: Sequelize.STRING,
allowNull: false
},
type: {
type: Sequelize.STRING,
allowNull: false
},
article: {
type: Sequelize.TEXT,
allowNull: true
},
utilizationForm: {
type: Sequelize.JSON,
allowNull: true
},
isOnline: {
type: Sequelize.BOOLEAN,
allowNull: false,

7
website/components/FunctionCard/FunctionCard.js
View File

@ -2,6 +2,7 @@ import Link from 'next/link';
import { useState, forwardRef } from 'react';
import Loader from '../Loader';
import './FunctionCard.css';
import { API_URL } from '../../config/config';
const FunctionCard = forwardRef((props, ref) => {
@ -11,9 +12,11 @@ const FunctionCard = forwardRef((props, ref) => {
setIsLoading(false);
}
const isFormOrArticle = (props.type === 'form' || props.type === 'article');
return (
<Link
href={"/functions/[slug]"}
href={isFormOrArticle ? "/functions/[slug]" : `/functions/${props.slug}`}
as={`/functions/${props.slug}`}
>
{/* FunctionCard a une hauteur pendant chargement */}
@ -23,7 +26,7 @@ const FunctionCard = forwardRef((props, ref) => {
<div className={`FunctionCard__container ${isLoading ? "d-none" : ""}`}>
<div className="FunctionCard__top">
<img onLoad={handleLoad} className="FunctionCard__image" alt={props.title} src={props.image} />
<img onLoad={handleLoad} className="FunctionCard__image" alt={props.title} src={API_URL + props.image} />
<h2 className="FunctionCard__title">{props.title}</h2>
<p className="FunctionCard__description">{props.description}</p>
</div>

6
website/components/HeadTag.js
View File

@ -34,4 +34,10 @@ const HeadTag = ({ title, image, description }) => (
</Head>
);
HeadTag.defaultProps = {
title: "FunctionProject",
description: "Apprenez la programmation grâce à l'apprentissage par projet alias fonction.",
image: "/images/FunctionProject_icon_small.png"
}
export default HeadTag;

10
website/pages/functions/[slug].js
View File

@ -5,18 +5,18 @@ import { API_URL } from '../../config/config';
const FunctionComponent = () => {
const router = useRouter();
const { slug } = useRouter().query;
return (
<Fragment>
<HeadTag
title={router.query.slug}
description={router.query.slug}
image={`${API_URL}/images/functions/${router.query.slug}.png`}
title={slug}
description={slug}
image={`${API_URL}/images/functions/${slug}.png`}
/>
<div className="container text-center">
<div className="row justify-content-center">
<h1>{router.query.slug}</h1>
<h1>{slug}</h1>
</div>
</div>
</Fragment>

5
website/pages/functions/index.js
View File

@ -3,7 +3,6 @@ import HeadTag from '../../components/HeadTag';
import FunctionCard from '../../components/FunctionCard/FunctionCard';
import Loader from '../../components/Loader';
import '../../public/css/pages/functions.css';
import { API_URL } from '../../config/config';
import api from '../../config/api';
import useAPI from '../../hooks/useAPI';
@ -86,9 +85,9 @@ const Functions = () => {
{functionsData.rows.map((f, index) => {
// Si c'est le dernier élément
if (functionsData.rows.length === index + 1) {
return <FunctionCard ref={lastFunctionCardRef} key={f.id} slug={f.slug} image={API_URL + f.image} title={f.title} description={f.description} category={f.categorie} publicationDate={new Date(f.createdAt).toLocaleDateString('fr-FR')} />;
return <FunctionCard ref={lastFunctionCardRef} key={f.id} slug={f.slug} image={f.image} title={f.title} description={f.description} category={f.categorie} publicationDate={new Date(f.createdAt).toLocaleDateString('fr-FR')} type={f.type} />;
}
return <FunctionCard key={f.id} slug={f.slug} image={API_URL + f.image} title={f.title} description={f.description} category={f.categorie} publicationDate={new Date(f.createdAt).toLocaleDateString('fr-FR')} />;
return <FunctionCard key={f.id} slug={f.slug} image={f.image} title={f.title} description={f.description} category={f.categorie} publicationDate={new Date(f.createdAt).toLocaleDateString('fr-FR')} type={f.type} />;
})}
</div>
{isLoadingFunctions && <Loader />}

15
website/pages/index.js
View File

@ -19,21 +19,17 @@ const Home = () => {
return (
<Fragment>
<HeadTag
title="FunctionProject"
description="FunctionProject est un projet créé par Divlo qui a pour but de rassembler plein de mini-programme permettant de faire plusieurs choses comme savoir la météo, générer un nombre aléatoire, etc."
image="/images/FunctionProject_icon_small.png"
/>
<HeadTag />
<div className="Home__container container-fluid text-center">
<AutoPlaySwipeableViews enableMouseEvents interval={30000}>
<AutoPlaySwipeableViews enableMouseEvents interval={15000}>
{/* Slide 1 */}
<div className="row align-items-center justify-content-center">
<div className="col-24">
<h1 className="Home__title-important important">FunctionProject</h1>
<p className="Home__description">
Apprenez la programmation grâce à l'apprentissage par projet.<br/>
Apprenez la programmation grâce à l'apprentissage par projet alias fonction.<br/>
Découvrez la liste des fonctions disponibles :
</p>
</div>
@ -49,8 +45,9 @@ const Home = () => {
<div className="col-24">
<h1 className="Home__title-important important">Code Source</h1>
<p className="Home__description">
Le partage est essentiel afin de progresser tous ensemble. <br/>
Par conséquent le code source du projet est disponible sur mon profil GitHub :
Le partage est essentiel afin de progresser. <br/>
Par conséquent chaque fonction a un article expliquant comment elle fonctionne et <br/>
le code source du projet est disponible sur mon profil GitHub :
</p>
</div>
<div className="col-24">