diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/App.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/App.vue
index 617c0e4dd..d06a4c001 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/App.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/App.vue
@@ -5,6 +5,7 @@
    <h1 v-if="accompanyingCourse.step === 'DRAFT'">{{ $t('course.title.draft') }}</h1>
    <h1 v-else>{{ $t('course.title.active') }}</h1>
    
+   <origin-demand></origin-demand>
    <persons-associated></persons-associated>
    <requestor></requestor>
    <social-issue></social-issue>
@@ -19,6 +20,7 @@
 import { mapState } from 'vuex'
 import Banner from './components/Banner.vue';
 import StickyNav from './components/StickyNav.vue';
+import OriginDemand from './components/OriginDemand.vue';
 import PersonsAssociated from './components/PersonsAssociated.vue';
 import Requestor from './components/Requestor.vue';
 import SocialIssue from './components/SocialIssue.vue';
@@ -32,6 +34,7 @@ export default {
    components: { 
       Banner,
       StickyNav,
+      OriginDemand,
       PersonsAssociated, 
       Requestor,
       SocialIssue,
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/api.js b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/api.js
index 70b2ba56e..317485006 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/api.js
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/api.js
@@ -165,6 +165,33 @@ const postSocialIssue = (id, body, method) => {
       });
 };
 
+const getUsers = () => {
+   const url = `/api/1.0/...json`;
+   return fetch(url)
+      .then(response => {
+         if (response.ok) { return response.json(); }
+         throw Error('Error with request resource response'); 
+      });
+};
+
+const getListOrigins = () => {
+   const url = `/api/1.0/person/accompanying-period/origin.json`;
+   return fetch(url)
+      .then(response => {
+         if (response.ok) { return response.json(); }
+         throw Error('Error with request resource response'); 
+      });
+}
+
+const getOrigin = (id) => {
+   const url = `/api/1.0/person/accompanying-period/origin/${id}.json`;
+   return fetch(url)
+      .then(response => {
+         if (response.ok) { return response.json(); }
+         throw Error('Error with request resource response'); 
+      });
+}
+
 export { 
    getAccompanyingCourse,
    patchAccompanyingCourse,
@@ -173,5 +200,8 @@ export {
    postParticipation,
    postRequestor,
    postResource,
+   getUsers,
+   getListOrigins,
+   getOrigin,
    postSocialIssue
 };
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/OriginDemand.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/OriginDemand.vue
new file mode 100644
index 000000000..8706601e2
--- /dev/null
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/OriginDemand.vue
@@ -0,0 +1,37 @@
+<template>
+   <div class="vue-component">
+     <h2><a name="section-05"></a>{{ $t('origin.title') }}</h2>
+
+     hop
+   </div>
+</template>
+
+<script>
+import { getOrigins } from '../api';
+import { mapState } from 'vuex';
+
+export default {
+   name: 'OriginDemand',
+   data() {
+      return {
+         options: []
+      }
+   },
+   computed: {
+      ...mapState({
+         value: state => state.accompanyingCourse.origin,
+      }),
+   },
+   mounted() {
+      this.getOptions();
+   },
+   methods: {
+      getOptions() {
+         console.log('loading origins list');
+      }
+   }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/js/i18n.js b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/js/i18n.js
index f5741b34a..f41424462 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/js/i18n.js
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/js/i18n.js
@@ -26,6 +26,9 @@ const appMessages = {
          regular: "régulier",
          occasional: "ponctuel"
       },
+      origin: {
+         title: "Origine de la demande",
+      },
       persons_associated: {
          title: "Usagers concernés",
          counter: "Il n'y a pas encore d'usager | 1 usager | {count} usagers",