diff --git a/package.json b/package.json
index 9a56b88b..bf1691a4 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
     "react-autosuggest": "^9.4.3",
     "react-dom": "^16.14.0",
     "react-geocode": "^0.2.2",
+    "react-helmet": "^6.1.0",
     "react-router-dom": "^5.2.0",
     "yaml": "^1.10.0"
   },
diff --git a/public/index.html b/public/index.html
index 17511a2f..21556125 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+
     <!--
       Notice the use of %PUBLIC_URL% in the tag above.
       It will be replaced with the URL of the `public` folder during the build.
diff --git a/src/components/Header.jsx b/src/components/Header.jsx
index 958e2308..64b5349f 100644
--- a/src/components/Header.jsx
+++ b/src/components/Header.jsx
@@ -1,6 +1,8 @@
 import React, { Component } from 'react';
 import { Link } from 'react-router-dom';
 import Authenticated from './Authenticated.jsx';
+import Rss from './Rss.jsx';
+import {Helmet} from 'react-helmet';
 
 class Header extends Component {
 
@@ -13,8 +15,13 @@ class Header extends Component {
   render() {
     return (
       <header className="row align-items-center">
-        <div className="col-lg-2 d-none d-lg-block logo"></div>
-        <h1 className="col-lg-8"><Link to="/">{this.state.user}</Link></h1>
+        <div className="col-lg-4 d-none d-lg-block logo"></div>
+        <h1 className="col-lg-4">
+          <Link to="/">{this.state.user}</Link>
+        </h1>
+        <div className="col-lg-2">
+          <Rss/>
+        </div>
         <div className="col-lg-2">
           <Authenticated conf={this.props.conf} />
         </div>
diff --git a/src/components/Rss.jsx b/src/components/Rss.jsx
new file mode 100644
index 00000000..4181a518
--- /dev/null
+++ b/src/components/Rss.jsx
@@ -0,0 +1,47 @@
+import React, { Component } from 'react';
+import { Trans } from '@lingui/macro';
+import { Link } from 'react-router-dom';
+
+const RssIcon = () => (
+  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 448 448" xmlSpace="preserve" >
+    <g>
+      <g>
+        <circle cx="64" cy="384" r="64" fill="#ffffff"/>
+      </g>
+    </g>
+    <g>
+      <g>
+        <path fill="#ffffff" d="M0,149.344v85.344c117.632,0,213.344,95.68,213.344,213.312h85.312C298.656,283.328,164.672,149.344,0,149.344z"/>
+      </g>
+    </g>
+    <g>
+      <g>
+        <path fill="#ffffff" d="M0,0v85.344C200,85.344,362.688,248,362.688,448H448C448,200.96,247.04,0,0,0z"/>
+      </g>
+    </g>
+  </svg>
+);
+
+class Rss extends Component {
+
+  constructor(props) {
+    super(props);
+    this.state = {rss: ''};
+  }
+
+  render() {
+    return (
+      <div className="rss-btn">
+        <Link to="/rss">
+          <div className="rss-icon">
+            <RssIcon/>
+          </div>
+          <Trans>Flux RSS</Trans>
+        </Link>
+      </div>
+    );
+  }
+
+}
+
+export default Rss;
\ No newline at end of file
diff --git a/src/components/rssPage/Rss.jsx b/src/components/rssPage/Rss.jsx
new file mode 100644
index 00000000..0b01824d
--- /dev/null
+++ b/src/components/rssPage/Rss.jsx
@@ -0,0 +1,337 @@
+import React, { Component } from 'react';
+import by from 'compare-func';
+import queryString from 'query-string';
+import Hypertopic from 'hypertopic';
+import conf from '../../config.js';
+import Viewpoint from '../portfolioPage/Viewpoint.jsx';
+import Corpora from '../portfolioPage/Corpora.jsx';
+import Header from '../Header.jsx';
+import Status from '../portfolioPage/Status.jsx';
+import SearchBar from '../portfolioPage/SearchBar.jsx';
+import { Trans } from '@lingui/macro';
+import { Items } from '../../model.js';
+import { Link } from 'react-router-dom';
+
+class RSS extends Component {
+  constructor() {
+    super();
+    this.state = {
+      viewpoints: [],
+      corpora: [],
+      items: [],
+      selectedItems: [],
+      topicsItems: new Map(),
+      services: [],
+      corpusSelected: '',
+      linkRss: ''
+    };
+    this._updateSelection();
+    conf.then(x => {
+      this.setState({services: x.services});
+    });
+  }
+
+  render() {
+    let viewpoints = this._getViewpoints();
+    let corpora = this._getCorpora();
+    let [linkRss, multiCorpus] = this._getRssLinks();
+    let tempLinkRss = linkRss.length > 1 ? linkRss[0] : linkRss;
+    let attributes = new Items(this.state.items)
+      .getAttributes()
+      .map(([key, value]) => key.concat(' : ', value))
+      .map(x => ({[x]: {name: x}}));
+    let candidates = this.state.viewpoints.concat(attributes);
+    return (
+      <div className="App container-fluid">
+        <Header conf={conf} />
+        <div className="container-fluid ">
+          <div className="App-content row justify-content-center">
+            <div className="col-sm-9 col-md-10 col-lg-6 col-xl-4 col-xxl-4 p-4">
+              <div className="Description">
+                <h2 className="h4 text-center"><Trans>Flux RSS</Trans></h2>
+                <div className="p-3">
+                  <div className="col-sm-9 col-md-10 col-lg-3 col-xl-3 col-xxl-3">
+                    <select className="form-select form-select-lg mb-3" onChange={(e)=> this._setRssLink(e.target.value)}>
+                      {multiCorpus.map(corpus =>
+                        <option value={corpus} key={corpus}>{corpus}</option>
+                      )}
+                    </select>
+                  </div>
+                  <div className="row justify-content-around">
+                    <button className="btn btn-light creationButton" onClick={this._openRssWindows.bind(this, tempLinkRss)}>
+                      <Trans>S'abonner à un corpus</Trans>
+                    </button>
+                    <Link to="/rss/topic">
+                      <button className="btn btn-light creationButton" >
+                        <Trans>S'abonner à un catégorie</Trans>
+                      </button>
+                    </Link>
+                  </div>
+                </div>
+                <div className="p-4">
+                  <div className="font-weight-bold p-1">
+                    <Trans>Qu'est-ce qu'un flux RSS ?</Trans>
+                  </div>
+                  <div className="ExplicativeText">
+                    <Trans>Les flux RSS sont des fils de contenus . Chaque flux correspond à une rubrique ou une sous-rubrique du site. En vous abonnant à un flux, vous recevrez automatiquement le titre, auteur, et informations importantes des derniers items ajoutés ou modifiés.</Trans>
+                  </div>
+                </div>
+                <div className="p-4">
+                  <div className="font-weight-bold p-1">
+                    <Trans>Comment utiliser les flux RSS ?</Trans>
+                  </div>
+                  <div className="ExplicativeText">
+                    <Trans>Pour pouvoir utiliser les flux RSS, plusieurs solutions existent. Vous pouvez utiliser un agrégateur de flux, via un site web ou une application mobile, comme FlipBoard, Feedly, Netvibes, In oreader ou encore News Blur. Alternativament, un lecteur RSS peut être installé directement sur votre navigateur web.</Trans>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+    hasChanged = async () => new Hypertopic((await conf).services)
+      .get({_id: ''})
+      .then(x =>
+        x.update_seq !== this.update_seq && (this.update_seq = x.update_seq)
+      );
+
+    componentDidMount() {
+      let start = new Date().getTime();
+      this.hasChanged().then(() => {
+        this._fetchAll().then(() => {
+          let end = new Date().getTime();
+          let elapsedTime = end - start;
+          console.log('elapsed time ', elapsedTime);
+          let intervalTime = Math.max(10000, elapsedTime * 5);
+          console.log('reload every ', intervalTime);
+          this._timer = setInterval(
+            async () => {
+              this.hasChanged().then(x => {
+                if (x) this._fetchAll();
+              });
+            },
+            intervalTime
+          );
+        });
+      });
+    }
+
+    componentDidUpdate(prevProps) {
+      if (this.props !== prevProps) {
+        this._updateSelection();
+        this._updateSelectedItems();
+      }
+    }
+
+    componentWillUnmount() {
+      clearInterval(this._timer);
+    }
+
+    _openRssWindows(tempRssLink) {
+      if (this.state.linkRss !== '') {
+        window.open(this.state.linkRss);
+      } else {
+        window.open(tempRssLink);
+      }
+    }
+
+    _setRssLink(value) {
+      let servicePrincipal = this.state.services[0];
+      let origin = window.location.origin;
+      let linkRss = `${servicePrincipal}/feed/${encodeURI(value)}?app=${origin}`;
+      this.setState({linkRss});
+    }
+
+    _getRssLinks() {
+      let servicePrincipal = this.state.services[0];
+      let corpora = this._getCorpora();
+      let ids = corpora.props.ids;
+      let multiCorpus = ids.map(id => encodeURI(id));
+      let origin = window.location.origin;
+      let linkRss = multiCorpus.map(corpus => `${servicePrincipal}/feed/${corpus}?app=${origin}`);
+      return [linkRss, ids];
+    }
+
+    _getTopic(id) {
+      for (let v of this.state.viewpoints) {
+        if (v[id]) return v[id];
+      }
+      return null;
+    }
+
+    _updateSelection() {
+      try {
+        this.selectionJSON = JSON.parse(queryString.parse(window.location.search).t);
+      } catch (e) {
+        this.selectionJSON = {
+          type: 'intersection',
+          data: []
+        };
+      }
+      this.selection = (this.selectionJSON.hasOwnProperty('data'))
+        ? this.selectionJSON.data.map(s => (s.selection === undefined)
+          ? []
+          : s.selection).flat()
+        : [];
+      this.exclusion = (this.selectionJSON.hasOwnProperty('data'))
+        ? this.selectionJSON.data.map(s => (s.exclusion === undefined)
+          ? []
+          : s.exclusion).flat()
+        : [];
+    }
+
+    _getTopicPath(topicId) {
+      let topic = this._getTopic(topicId);
+      let path = (topic && topic.broader) ? this._getTopicPath(topic.broader[0].id) : [];
+      path.push(topicId);
+      return path;
+    }
+
+    _getItemTopicsPaths(item) {
+      return (item.topic || []).map(t => this._getTopicPath(t.id));
+    }
+
+    _getRecursiveItemTopics(item) {
+      return Array.prototype.concat(...this._getItemTopicsPaths(item));
+    }
+
+    _getItemAttributes(item) {
+      return new Items(
+        [item]
+      ).getAttributes()
+        .map(([key, value]) => key.concat(' : ', value));
+    }
+
+    _isSelected(item, list) {
+      let itemHasValue = list.data.map(l => includes(this._getRecursiveItemTopics(item).concat(this._getItemAttributes(item)), (l.selection || []), (l.exclusion || []), (l.type === 'union')));
+      if (list.type === 'union')
+        return itemHasValue.reduce((c1, c2) => c1 || c2, false);
+      return itemHasValue.reduce((c1, c2) => c1 && c2, true);
+    }
+
+    _updateSelectedItems() {
+      let selectedItems;
+      if (this.selectionJSON.data.length > 0)
+        selectedItems = this.state.items.filter(e => this._isSelected(e, this.selectionJSON));
+      else
+        selectedItems = this.state.items;
+      let topicsItems = new Map();
+      for (let e of selectedItems) {
+        for (let t of this._getRecursiveItemTopics(e)) {
+          push(topicsItems, t, e.id);
+        }
+      }
+      this.setState({selectedItems, topicsItems});
+    }
+
+    async _fetchUser(SETTINGS, hypertopic) {
+      return hypertopic.getView(`/user/${SETTINGS.user}`)
+        .then(data => {
+          let user = data[SETTINGS.user] || {};
+          user = {
+            viewpoint: user.viewpoint || [],
+            corpus: user.corpus || []
+          };
+          if (!this.state.viewpoints.length && !this.state.corpora.length) { //TODO compare old and new
+            this.setState({ viewpoints: user.viewpoint, corpora: user.corpus });
+          }
+          return user;
+        });
+    }
+
+    async _fetchViewpoints(hypertopic, user) {
+      return hypertopic.getView(user.viewpoint.map(x => `/viewpoint/${x.id}`))
+        .then(data => {
+          let viewpoints = [];
+          for (let v of this.state.viewpoints) {
+            let viewpoint = data[v.id];
+            viewpoint.id = v.id;
+            viewpoints.push(viewpoint);
+          }
+          this.setState({viewpoints});
+          return data;
+        });
+    }
+
+    async _fetchItems(hypertopic) {
+      return hypertopic.getView(this.state.corpora.map(x => `/corpus/${x.id}`))
+        .then(data => {
+          let items = [];
+          for (let corpus of this.state.corpora) {
+            for (let itemId in data[corpus.id]) {
+              if (!['id', 'name', 'user'].includes(itemId)) {
+                let item = data[corpus.id][itemId];
+                if (!item.name || !item.name.length) {
+                  console.log(`/item/${corpus.id}/${itemId} has no name!`);
+                } else {
+                  item.id = itemId;
+                  item.corpus = corpus.id;
+                  items.push(item);
+                }
+              }
+            }
+          }
+          this.setState({items});
+        });
+    }
+
+    async _fetchAll() {
+      let SETTINGS = await conf;
+      let hypertopic = new Hypertopic(SETTINGS.services);
+
+      return this._fetchUser(SETTINGS, hypertopic)
+        .then(x => Promise.all([this._fetchViewpoints(hypertopic, x), this._fetchItems(hypertopic)]))
+        .then(() => this._updateSelectedItems());
+    }
+
+    _getViewpoints() {
+      return this.state.viewpoints.sort(by('name')).map((v, i) =>
+        <div key={v.id}>
+          {i > 0 && <hr/>}
+          <Viewpoint viewpoint={v} selection={this.selection} exclusion={this.exclusion} selectionJSON={this.selectionJSON}
+            topicsItems={this.state.topicsItems} />
+        </div>
+      );
+    }
+
+    _getCorpora() {
+      let ids = this.state.corpora.map(c => c.id);
+      return (
+        <Corpora
+          ids={ids}
+          from={this.state.items.length}
+          items={this.state.selectedItems}
+          conf={conf}
+        />
+      );
+    }
+}
+function includes(array1, array2, array3, union) {
+  let set1 = new Set(array1);
+  let arrayHasValue = array2.map(e => set1.has(e));
+  let arrayDontHaveValue = array3.map(e => set1.has(e));
+  if (union)
+    return arrayHasValue.reduce((c1, c2) => c1 || c2, false)
+            || ((array3.length > 0)
+              ? !arrayDontHaveValue.reduce((c1, c2) => c1 || c2, false)
+              : false
+            );
+  return arrayHasValue.reduce((c1, c2) => c1 && c2, true)
+        && ((array3.length > 0)
+          ? !arrayDontHaveValue.reduce((c1, c2) => c1 && c2, true)
+          : true
+        );
+}
+
+function push(map, topicId, itemId) {
+  let old = map.get(topicId);
+  if (old) {
+    map.set(topicId, old.add(itemId));
+  } else {
+    map.set(topicId, new Set([itemId]));
+  }
+}
+export default RSS;
diff --git a/src/components/rssPage/RssTopic.jsx b/src/components/rssPage/RssTopic.jsx
new file mode 100644
index 00000000..2b87563c
--- /dev/null
+++ b/src/components/rssPage/RssTopic.jsx
@@ -0,0 +1,271 @@
+import React, { Component } from 'react';
+import by from 'compare-func';
+import queryString from 'query-string';
+import Hypertopic from 'hypertopic';
+import conf from '../../config.js';
+import Viewpoint from './Viewpoint.jsx';
+import Corpora from '../portfolioPage/Corpora.jsx';
+import Header from '../Header.jsx';
+import Status from '../portfolioPage/Status.jsx';
+import SearchBar from '../portfolioPage/SearchBar.jsx';
+import { Trans } from '@lingui/macro';
+import { Items } from '../../model.js';
+
+class RSSTopic extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      viewpoints: [],
+      corpora: [],
+      items: [],
+      selectedItems: [],
+      topicsItems: new Map()
+    };
+    this._updateSelection();
+  }
+
+  render() {
+    let viewpoints = this._getViewpoints();
+    let corpora = this._getCorpora();
+    let attributes = new Items(this.state.items)
+      .getAttributes()
+      .map(([key, value]) => key.concat(' : ', value))
+      .map(x => ({[x]: {name: x}}));
+    let candidates = this.state.viewpoints.concat(attributes);
+    return (
+      <div className="App container-fluid">
+        <Header conf={conf} />
+        <div className="container-fluid ">
+          <div className="App-content row justify-content-center">
+            <div className="col-md-4 p-4">
+              <div className="Description">
+                <h2 className="h4 text-center"><Trans>Flux RSS</Trans></h2>
+                <div className="p-3">
+                  {viewpoints}
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+    hasChanged = async () => new Hypertopic((await conf).services)
+      .get({_id: ''})
+      .then(x =>
+        x.update_seq !== this.update_seq && (this.update_seq = x.update_seq)
+      );
+
+    componentDidMount() {
+      let start = new Date().getTime();
+      this.hasChanged().then(() => {
+        this._fetchAll().then(() => {
+          let end = new Date().getTime();
+          let elapsedTime = end - start;
+          console.log('elapsed time ', elapsedTime);
+          let intervalTime = Math.max(10000, elapsedTime * 5);
+          console.log('reload every ', intervalTime);
+          this._timer = setInterval(
+            async () => {
+              this.hasChanged().then(x => {
+                if (x) this._fetchAll();
+              });
+            },
+            intervalTime
+          );
+        });
+      });
+    }
+
+    componentDidUpdate(prevProps) {
+      if (this.props !== prevProps) {
+        this._updateSelection();
+        this._updateSelectedItems();
+      }
+    }
+
+    componentWillUnmount() {
+      clearInterval(this._timer);
+    }
+
+    _getTopic(id) {
+      for (let v of this.state.viewpoints) {
+        if (v[id]) return v[id];
+      }
+      return null;
+    }
+
+    _updateSelection() {
+      try {
+        this.selectionJSON = JSON.parse(queryString.parse(window.location.search).t);
+      } catch (e) {
+        this.selectionJSON = {
+          type: 'intersection',
+          data: []
+        };
+      }
+      this.selection = (this.selectionJSON.hasOwnProperty('data'))
+        ? this.selectionJSON.data.map(s => (s.selection === undefined)
+          ? []
+          : s.selection).flat()
+        : [];
+      this.exclusion = (this.selectionJSON.hasOwnProperty('data'))
+        ? this.selectionJSON.data.map(s => (s.exclusion === undefined)
+          ? []
+          : s.exclusion).flat()
+        : [];
+    }
+
+    _getTopicPath(topicId) {
+      let topic = this._getTopic(topicId);
+      let path = (topic && topic.broader) ? this._getTopicPath(topic.broader[0].id) : [];
+      path.push(topicId);
+      return path;
+    }
+
+    _getItemTopicsPaths(item) {
+      return (item.topic || []).map(t => this._getTopicPath(t.id));
+    }
+
+    _getRecursiveItemTopics(item) {
+      return Array.prototype.concat(...this._getItemTopicsPaths(item));
+    }
+
+    _getItemAttributes(item) {
+      return new Items(
+        [item]
+      ).getAttributes()
+        .map(([key, value]) => key.concat(' : ', value));
+    }
+
+    _isSelected(item, list) {
+      let itemHasValue = list.data.map(l => includes(this._getRecursiveItemTopics(item).concat(this._getItemAttributes(item)), (l.selection || []), (l.exclusion || []), (l.type === 'union')));
+      if (list.type === 'union')
+        return itemHasValue.reduce((c1, c2) => c1 || c2, false);
+      return itemHasValue.reduce((c1, c2) => c1 && c2, true);
+    }
+
+    _updateSelectedItems() {
+      let selectedItems;
+      if (this.selectionJSON.data.length > 0)
+        selectedItems = this.state.items.filter(e => this._isSelected(e, this.selectionJSON));
+      else
+        selectedItems = this.state.items;
+      let topicsItems = new Map();
+      for (let e of selectedItems) {
+        for (let t of this._getRecursiveItemTopics(e)) {
+          push(topicsItems, t, e.id);
+        }
+      }
+      this.setState({selectedItems, topicsItems});
+    }
+
+    async _fetchUser(SETTINGS, hypertopic) {
+      return hypertopic.getView(`/user/${SETTINGS.user}`)
+        .then(data => {
+          let user = data[SETTINGS.user] || {};
+          user = {
+            viewpoint: user.viewpoint || [],
+            corpus: user.corpus || []
+          };
+          if (!this.state.viewpoints.length && !this.state.corpora.length) { //TODO compare old and new
+            this.setState({ viewpoints: user.viewpoint, corpora: user.corpus });
+          }
+          return user;
+        });
+    }
+
+    async _fetchViewpoints(hypertopic, user) {
+      return hypertopic.getView(user.viewpoint.map(x => `/viewpoint/${x.id}`))
+        .then(data => {
+          let viewpoints = [];
+          for (let v of this.state.viewpoints) {
+            let viewpoint = data[v.id];
+            viewpoint.id = v.id;
+            viewpoints.push(viewpoint);
+          }
+          this.setState({viewpoints});
+          return data;
+        });
+    }
+
+    async _fetchItems(hypertopic) {
+      return hypertopic.getView(this.state.corpora.map(x => `/corpus/${x.id}`))
+        .then(data => {
+          let items = [];
+          for (let corpus of this.state.corpora) {
+            for (let itemId in data[corpus.id]) {
+              if (!['id', 'name', 'user'].includes(itemId)) {
+                let item = data[corpus.id][itemId];
+                if (!item.name || !item.name.length) {
+                  console.log(`/item/${corpus.id}/${itemId} has no name!`);
+                } else {
+                  item.id = itemId;
+                  item.corpus = corpus.id;
+                  items.push(item);
+                }
+              }
+            }
+          }
+          this.setState({items});
+        });
+    }
+
+    async _fetchAll() {
+      let SETTINGS = await conf;
+      let hypertopic = new Hypertopic(SETTINGS.services);
+
+      return this._fetchUser(SETTINGS, hypertopic)
+        .then(x => Promise.all([this._fetchViewpoints(hypertopic, x), this._fetchItems(hypertopic)]))
+        .then(() => this._updateSelectedItems());
+    }
+
+    _getViewpoints() {
+      return this.state.viewpoints.sort(by('name')).map((v, i) =>
+        <div key={v.id}>
+          {i > 0 && <hr/>}
+          <Viewpoint viewpoint={v} selection={this.selection} exclusion={this.exclusion} selectionJSON={this.selectionJSON}
+            topicsItems={this.state.topicsItems} />
+        </div>
+      );
+    }
+
+    _getCorpora() {
+      let ids = this.state.corpora.map(c => c.id);
+      return (
+        <Corpora
+          ids={ids}
+          from={this.state.items.length}
+          items={this.state.selectedItems}
+          conf={conf}
+        />
+      );
+    }
+}
+function includes(array1, array2, array3, union) {
+  let set1 = new Set(array1);
+  let arrayHasValue = array2.map(e => set1.has(e));
+  let arrayDontHaveValue = array3.map(e => set1.has(e));
+  if (union)
+    return arrayHasValue.reduce((c1, c2) => c1 || c2, false)
+            || ((array3.length > 0)
+              ? !arrayDontHaveValue.reduce((c1, c2) => c1 || c2, false)
+              : false
+            );
+  return arrayHasValue.reduce((c1, c2) => c1 && c2, true)
+        && ((array3.length > 0)
+          ? !arrayDontHaveValue.reduce((c1, c2) => c1 && c2, true)
+          : true
+        );
+}
+
+function push(map, topicId, itemId) {
+  let old = map.get(topicId);
+  if (old) {
+    map.set(topicId, old.add(itemId));
+  } else {
+    map.set(topicId, new Set([itemId]));
+  }
+}
+export default RSSTopic;
diff --git a/src/components/rssPage/Topic.jsx b/src/components/rssPage/Topic.jsx
new file mode 100644
index 00000000..61e76d3a
--- /dev/null
+++ b/src/components/rssPage/Topic.jsx
@@ -0,0 +1,112 @@
+import React, { Component } from 'react';
+import { withRouter } from 'react-router-dom';
+import by from 'compare-func';
+
+class Topic extends Component {
+  constructor(props) {
+    super();
+    this.handleCollapse = this.handleCollapse.bind(this);
+    this.handleClick = this.handleClick.bind(this);
+    let hasSubtopics = (props.topics[props.id].narrower || []).length;
+    this.state = {
+      fold: hasSubtopics ? 'Opened' : ''
+    };
+  }
+
+  render() {
+    let subtopics = this._getSubtopics();
+    let isSelected = this.props.selection.includes(this.props.id);
+    let isExcluded = this.props.exclusion.includes(this.props.id);
+    let topicClasses = (isSelected ? 'Selected' : '') + ' ' + (isExcluded ? 'Excluded' : '');
+    let topic = 'Topic ' + this.state.fold;
+
+    let bullet = getBullet(this.state.fold);
+    return (
+      <li className={topic}>
+        <span className={bullet.className} title={bullet.title} aria-hidden="true" onClick={this.handleCollapse} />
+        <button className={topicClasses + ' btn btn-link p-0 border-0 removeUnderlineOnFocus text-dark'} onClick={this.handleClick}>{this.props.name}</button>
+        <ul>
+          {subtopics}
+        </ul>
+      </li>
+    );
+  }
+
+  _getSubtopics() {
+    const topic = this.props.topics[this.props.id];
+    return (topic.narrower || []).sort(by('name')).map(t =>
+      <Topic key={t.id} id={t.id} name={t.name} topics={this.props.topics}
+        selection={this.props.selection} exclusion={this.props.exclusion}
+        selectionJSON={this.props.selectionJSON}
+        topicsItems={this.props.topicsItems}
+        history={this.props.history}
+      />
+    );
+  }
+
+  handleCollapse(e) {
+    e.preventDefault();
+    this.setState({fold: fold(this.state.fold)});
+  }
+
+  handleClick(e) {
+    e.preventDefault();
+    updateSelectionJSON(this.props.topics, this.props.id, this.props.selectionJSON);
+    this.props.history.push(this.props.name);
+  }
+}
+
+function updateSelectionJSON(array, item, selection) {
+  if (selection === undefined)
+    return;
+  let found = selection.data.filter(s => {
+    let allTopics = [...(s.selection || []), ...(s.exclusion || [])];
+    if (allTopics.length === 0 || array[allTopics[0]] === undefined) {
+      return false;
+    }
+    return (!array[allTopics[0]].hasOwnProperty('broader') && !array[item].hasOwnProperty('broader'))
+        || (array[allTopics[0]].hasOwnProperty('broader') && array[allTopics[0]].broader[0].id) === (array[item].hasOwnProperty('broader') && array[item].broader[0].id);
+
+  });
+
+  if (found.length === 0) {
+    selection.data.push({type: 'intersection', selection: [item], exclusion: []});
+  } else {
+    if (!found[0].hasOwnProperty('selection'))
+      found[0].selection = [];
+    if (!found[0].hasOwnProperty('exclusion'))
+      found[0].exclusion = [];
+    switchPlace(found[0], item);
+    if ((!Array.isArray(found[0].selection) || !found[0].selection.length) && (!Array.isArray(found[0].exclusion) || !found[0].exclusion.length))
+      selection.data.splice(selection.data.indexOf(found[0]), 1);
+  }
+}
+
+function switchPlace(object, item) {
+  let index;
+  if ((index = object.selection.indexOf(item)) > -1) {
+    object.selection.splice(index, 1);
+    object.exclusion.push(item);
+  } else if ((index = object.exclusion.indexOf(item)) > -1) {
+    object.exclusion.splice(index, 1);
+  } else {
+    object.selection.push(item);
+  }
+}
+
+function fold(x) {
+  switch (x) {
+    case 'Closed': return 'Opened';
+    case 'Opened': return 'Closed';
+    default: return '';
+  }
+}
+
+function getBullet(x) {
+  switch (x) {
+    case 'Closed': return {className: 'oi oi-caret-right cursor-pointer', title: 'Déplier'};
+    case 'Opened': return {className: 'oi oi-caret-bottom cursor-pointer', title: 'Replier'};
+    default: return {className: 'oi leaf', title: ''};
+  }
+}
+export default withRouter(Topic);
diff --git a/src/components/rssPage/Viewpoint.jsx b/src/components/rssPage/Viewpoint.jsx
new file mode 100644
index 00000000..7891f6d6
--- /dev/null
+++ b/src/components/rssPage/Viewpoint.jsx
@@ -0,0 +1,33 @@
+import React, { Component } from 'react';
+import by from 'compare-func';
+import Topic from './Topic.jsx';
+
+class Viewpoint extends Component {
+  render() {
+    let topics = this._getTopics();
+    return (
+      <div>
+        <h3 className="h4">
+          {this.props.viewpoint.name}
+        </h3>
+        <hr/>
+        <div className="Topics">
+          <ul>
+            {topics}
+          </ul>
+        </div>
+      </div>
+    );
+  }
+
+  _getTopics() {
+    return (this.props.viewpoint.upper || []).sort(by('name')).map((t) =>
+      <Topic key={t.id} id={t.id} name={t.name} topics={this.props.viewpoint}
+        selection={this.props.selection} selectionJSON={this.props.selectionJSON}
+        exclusion={ this.props.exclusion} topicsItems={this.props.topicsItems}
+      />
+    );
+  }
+}
+
+export default Viewpoint;
diff --git a/src/index.js b/src/index.js
index 0d6b1a33..45d8ee20 100644
--- a/src/index.js
+++ b/src/index.js
@@ -4,6 +4,7 @@ import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
 import Portfolio from './components/portfolioPage/Portfolio.jsx';
 import Item from './components/itemPage/Item.jsx';
 import Outliner from './components/viewpointPage/Outliner.jsx';
+import RSS from './components/rssPage/Rss';
 
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'open-iconic/font/css/open-iconic-bootstrap.css';
@@ -14,6 +15,7 @@ import { I18nProvider } from '@lingui/react';
 import { setupI18n } from '@lingui/core';
 import catalogEn from './locales/en/messages.js';
 import catalogFr from './locales/fr/messages.js';
+import RSSTopic from './components/rssPage/RssTopic';
 
 var languages = window.navigator.languages.map(x => x.slice(0, 2));
 const catalogList = {
@@ -44,6 +46,8 @@ ReactDOM.render(
       <Switch>
         <Route path="/item/:corpus/:item" component={Item} />
         <Route path="/viewpoint/:id" component={Outliner} />
+        <Route path="/rss/topic/" component={RSSTopic} />
+        <Route path="/rss/" component={RSS} />
         <Route path="/" component={Portfolio} />
       </Switch>
     </Router>
diff --git a/src/locales/en/messages.po b/src/locales/en/messages.po
deleted file mode 100644
index ddcbf032..00000000
--- a/src/locales/en/messages.po
+++ /dev/null
@@ -1,129 +0,0 @@
-msgid ""
-msgstr ""
-"POT-Creation-Date: 2020-05-07 12:44+0200\n"
-"Mime-Version: 1.0\n"
-"Content-Type: text/plain; charset=utf-8\n"
-"Content-Transfer-Encoding: 8bit\n"
-"X-Generator: @lingui/cli\n"
-"Language: en\n"
-"Project-Id-Version: \n"
-"Report-Msgid-Bugs-To: \n"
-"PO-Revision-Date: \n"
-"Last-Translator: \n"
-"Language-Team: \n"
-"Plural-Forms: \n"
-
-#: src/components/itemPage/Item.jsx:189
-msgid "Ajouter un attribut et une valeur..."
-msgstr "Add an attribute and a value..."
-
-#: src/components/itemPage/Viewpoint.jsx:71
-msgid "Ajouter une rubrique..."
-msgstr "Add a topic..."
-
-#: src/components/itemPage/Item.jsx:55
-msgid "Attributs du document"
-msgstr "Document attributes"
-
-#: src/components/itemPage/Viewpoint.jsx:71
-msgid "Choisir une rubrique parent..."
-msgstr "Choose a parent topic..."
-
-#: src/components/viewpointPage/Outliner.jsx:69
-msgid "Création du point de vue"
-msgstr "Create a viewpoint"
-
-#: src/components/itemPage/Item.jsx:52
-msgid "Description"
-msgstr "Description"
-
-#: src/components/portfolioPage/Badge.jsx:21
-msgid "Déselectionner"
-msgstr "Deselect"
-
-#: src/components/portfolioPage/Button.jsx:13
-#: src/components/portfolioPage/Button.jsx:14
-msgid "Et"
-msgstr "And"
-
-#: src/components/portfolioPage/Badge.jsx:17
-msgid "Exclure"
-msgstr "Exclude"
-
-#: src/components/portfolioPage/Badge.jsx:17
-msgid "Inclure"
-msgstr "Include"
-
-#: src/components/itemPage/SameNameBlock.jsx:20
-msgid "Items ayant le même nom"
-msgstr "Items having the same name"
-
-#: src/components/viewpointPage/Outliner.jsx:68
-msgid "Modification du point de vue"
-msgstr "Edit a viewpoint"
-
-#: src/components/viewpointPage/Outliner.jsx:59
-msgid "Nom du point de vue"
-msgstr "Viewpoint name"
-
-#: src/components/portfolioPage/ViewpointCreator.jsx:18
-msgid "Nouveau point de vue"
-msgstr "New viewpoint"
-
-#: src/components/portfolioPage/Button.jsx:13
-#: src/components/portfolioPage/Button.jsx:14
-msgid "Ou"
-msgstr "Or"
-
-#: src/components/portfolioPage/Portfolio.jsx:45
-msgid "Points de vue"
-msgstr "Viewpoints"
-
-#: src/components/portfolioPage/SearchBar.jsx:41
-msgid "Rechercher..."
-msgstr "Search..."
-
-#: src/components/itemPage/Item.jsx:45
-#: src/components/viewpointPage/Outliner.jsx:32
-msgid "Retour à l'accueil"
-msgstr "Go back to home page"
-
-#: src/components/Authenticated.jsx:31
-msgid "Se connecter"
-msgstr "Log in"
-
-#: src/components/Authenticated.jsx:37
-msgid "Se connecter..."
-msgstr "Log in..."
-
-#: src/components/Authenticated.jsx:22
-msgid "Se déconnecter"
-msgstr "Log out"
-
-#: src/components/portfolioPage/Status.jsx:26
-msgid "Rubrique inconnue"
-msgstr "Unknown topic"
-
-#: src/components/portfolioPage/Status.jsx:10
-msgid "Tous les items"
-msgstr "All items"
-
-#: src/components/itemPage/Item.jsx:284
-msgid "Voulez-vous réellement que l'item affiché ne soit plus décrit à l'aide de cette rubrique ?"
-msgstr "Remove this topic for this item?"
-
-#: src/components/itemPage/Item.jsx:191
-msgid "attribut : valeur"
-msgstr "attribute: value"
-
-#: src/components/Authenticated.jsx:30
-msgid "mot de passe"
-msgstr "Password"
-
-#: src/components/Authenticated.jsx:29
-msgid "nom d'utilisateur"
-msgstr "Username"
-
-#: src/components/itemPage/Attribute.jsx:89
-msgid "valeur"
-msgstr "value"
diff --git a/src/locales/fr/messages.po b/src/locales/fr/messages.po
index d5f284f6..3efc7ecd 100644
--- a/src/locales/fr/messages.po
+++ b/src/locales/fr/messages.po
@@ -127,3 +127,31 @@ msgstr "nom d'utilisateur"
 #: src/components/itemPage/Attribute.jsx:89
 msgid "valeur"
 msgstr "valeur"
+
+#: src/components/Rss.jsx:37
+msgid "Flux RSS"
+msgstr "Flux RSS"
+
+#: src/components/rssPage/Rss.jsx:59
+msgid "S'abonner à un corpus"
+msgstr "S'abonner à un corpus"
+
+#: src/components/rssPage/Rss.jsx:62
+msgid "S'abonner à un catégorie"
+msgstr "S'abonner à un catégorie"
+
+#: src/components/rssPage/Rss.jsx:68
+msgid "Qu'est-ce qu'un flux RSS ?"
+msgstr "Qu'est-ce qu'un flux RSS ?"
+
+#: src/components/rssPage/Rss.jsx:71
+msgid "Les flux RSS sont des fils de contenus . Chaque flux correspond à une rubrique ou une sous-rubrique du site. En vous abonnant à un flux, vous recevrez automatiquement le titre, auteur, et informations importantes des derniers items ajoutés ou modifiés."
+msgstr "Les flux RSS sont des fils de contenus . Chaque flux correspond à une rubrique ou une sous-rubrique du site. En vous abonnant à un flux, vous recevrez automatiquement le titre, auteur, et informations importantes des derniers items ajoutés ou modifiés."
+
+#: src/components/rssPage/Rss.jsx:76
+msgid "Comment utiliser les flux RSS ?"
+msgstr "Comment utiliser les flux RSS ?"
+
+#: src/components/rssPage/Rss.jsx:79
+msgid "Pour pouvoir utiliser les flux RSS, plusieurs solutions existent. Vous pouvez utiliser un agrégateur de flux, via un site web ou une application mobile, comme FlipBoard, Feedly, Netvibes, InoReader ou encore News Blur. Alternativament, un lecteur RSS peut être installé directement sur votre navigateur web."
+msgstr "Pour pouvoir utiliser les flux RSS, plusieurs solutions existent. Vous pouvez utiliser un agrégateur de flux, via un site web ou une application mobile, comme FlipBoard, Feedly, Netvibes, InoReader ou encore News Blur. Alternativament, un lecteur RSS peut être installé directement sur votre navigateur web."
diff --git a/src/styles/App.css b/src/styles/App.css
index 0923117b..c55eca8b 100644
--- a/src/styles/App.css
+++ b/src/styles/App.css
@@ -15,6 +15,25 @@
   min-height: 55px;
 }
 
+.App header .rss-parte {
+  text-align: center;
+  vertical-align: center;
+}
+
+.App header .rss-icon {
+  display: inline-block;
+  height: 18px;
+  width: 18px;
+  min-width: 14px;
+  min-height: 14px;
+  margin-right: 10px;
+}
+
+
+.ExplicativeText {
+  text-align: left;
+}
+
 h1 a, h1 a:hover {
   color: ivory;
   text-decoration: none;
@@ -31,6 +50,11 @@ h1 a, h1 a:hover {
   padding: 0 8px;
 }
 
+.rss-btn  a{
+  color: lightgrey;
+  padding: 0 8px;
+}
+
 .Authenticated input:not([type='submit']) {
   border: 0;
   margin: 1px;