diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js
index 0a70da7ba..eb1a63f22 100644
--- a/client/coral-framework/actions/auth.js
+++ b/client/coral-framework/actions/auth.js
@@ -1,69 +1,9 @@
 import * as actions from '../constants/auth';
-import {base, handleResp, getInit} from '../helpers';
+import {base, handleResp, getInit} from '../helpers/response';
 
-export const showSignInDialog = () => ({
-  type: actions.SHOW_SIGNIN_DIALOG
-});
-
-export const hideSignInDialog = ()  => ({
-  type: actions.HIDE_SIGNIN_DIALOG
-});
-
-export const loginFacebook = () => dispatch => {
-  dispatch(loginFacebookRequest());
-  window.open(
-    `${base}/auth/facebook`,
-    'Continue with Facebook',
-    'menubar=0,resizable=0,width=500,height=500,top=200,left=500'
-  );
-};
-
-export const loginFacebookCallback = (err, data) => {
-  let user;
-
-  if (err) {
-    console.error(err);
-    return;
-  }
-
-  try {
-    user = JSON.parse(data);
-  } catch (err) {
-    console.error('Can\'t parse the user json', err);
-    return;
-  }
-
-  console.log('User was loaded!', user);
-};
-
-export const logout = () => dispatch => {
-  dispatch(logoutRequest());
-  fetch(`${base}/auth`, getInit('DELETE'))
-  .then(handleResp)
-  .then(() => dispatch(dispatch(logoutSuccess())))
-  .catch(error => dispatch(logoutFailure(error)));
-};
-
-const logoutRequest = () => ({
-  type: actions.USER_LOGOUT_SUCCESS
-});
-
-const logoutSuccess = () => ({
-  type: actions.USER_LOGOUT_SUCCESS,
-});
-
-const logoutFailure = error => ({
-  type: actions.USER_LOGOUT_SUCCESS,
-  error
-});
-
-export const loginFacebookRequest = () => ({
-  type: actions.USER_FACEBOOK_LOGIN_REQUEST
-});
-
-export const loginRequest = () => ({
-  type: actions.USER_SIGNIN_REQUEST
-});
+// Dialog Actions
+export const showSignInDialog = () => ({type: actions.SHOW_SIGNIN_DIALOG});
+export const hideSignInDialog = () => ({type: actions.HIDE_SIGNIN_DIALOG});
 
 export const changeView = view => dispatch =>
   dispatch({
@@ -71,3 +11,72 @@ export const changeView = view => dispatch =>
     view
   });
 
+export const cleanState = () => ({type: actions.CLEAN_STATE});
+
+// Sign In Actions
+
+const signInRequest = () => ({type: actions.FETCH_SIGNIN_REQUEST});
+const signInSuccess = () => ({type: actions.FETCH_SIGNIN_SUCCESS});
+const signInFailure = () => ({type: actions.FETCH_SIGNIN_FAILURE});
+
+export const fetchSignIn = () => dispatch => {
+  dispatch(signInRequest());
+  fetch(`${base}/auth`, getInit('POST'))
+    .then(handleResp)
+    .then(() => dispatch(signInSuccess()))
+    .catch(error => dispatch(signInFailure(error)));
+};
+
+// Sign In - Facebook
+
+const signInFacebookRequest = () => ({type: actions.FETCH_SIGNIN_FACEBOOK_REQUEST});
+//const signInFacebookSuccess = () => ({type: actions.FETCH_SIGNIN_FACEBOOK_SUCCESS});
+//const signInFacebookFailure = () => ({type: actions.FETCH_SIGNIN_FACEBOOK_FAILURE});
+
+export const fetchSignInFacebook = () => dispatch => {
+  dispatch(signInFacebookRequest());
+  window.open(
+    `${base}/auth/facebook`,
+    'Continue with Facebook',
+    'menubar=0,resizable=0,width=500,height=500,top=200,left=500'
+  );
+};
+
+// Sign Up Actions
+
+const signUpRequest = () => ({type: actions.FETCH_SIGNUP_REQUEST});
+const signUpSuccess = () => ({type: actions.FETCH_SIGNUP_SUCCESS});
+const signUpFailure = () => ({type: actions.FETCH_SIGNUP_FAILURE});
+
+export const fetchSignUp = () => dispatch => {
+  dispatch(signUpRequest());
+  fetch(`${base}/auth`, getInit('POST'))
+    .then(handleResp)
+    .then(() => dispatch(signUpSuccess()))
+    .catch(error => dispatch(signUpFailure(error)));
+};
+
+// Forgot Password Actions
+
+const forgotPassowordRequest = () => ({type: actions.FETCH_FORGOT_PASSWORD_REQUEST});
+const forgotPassowordSuccess = () => ({type: actions.FETCH_FORGOT_PASSWORD_SUCCESS});
+const forgotPassowordFailure = () => ({type: actions.FETCH_FORGOT_PASSWORD_FAILURE});
+
+export const fetchForgotPassword = () => dispatch => {
+  dispatch(forgotPassowordRequest());
+  fetch(`${base}/forgot`, getInit('POST'))
+    .then(handleResp)
+    .then(() => dispatch(forgotPassowordSuccess()))
+    .catch(error => dispatch(forgotPassowordFailure(error)));
+};
+
+// LogOut
+
+export const logout = () => dispatch => {
+  dispatch(signInRequest());
+  fetch(`${base}/auth`, getInit('DELETE'))
+    .then(handleResp)
+    .then(() => dispatch(signInSuccess()))
+    .catch(error => dispatch(signInFailure(error)));
+};
+
diff --git a/client/coral-framework/helpers/error.js b/client/coral-framework/helpers/error.js
new file mode 100644
index 000000000..6ae79a996
--- /dev/null
+++ b/client/coral-framework/helpers/error.js
@@ -0,0 +1,4 @@
+export default {
+  email: 'Not a valid E-Mail',
+  password: 'Password must be at least 8 characters'
+};
diff --git a/client/coral-framework/helpers/index.js b/client/coral-framework/helpers/response.js
similarity index 100%
rename from client/coral-framework/helpers/index.js
rename to client/coral-framework/helpers/response.js
diff --git a/client/coral-framework/helpers/validate.js b/client/coral-framework/helpers/validate.js
new file mode 100644
index 000000000..e69de29bb
diff --git a/client/coral-sign-in/components/Alert.js b/client/coral-sign-in/components/Alert.js
new file mode 100644
index 000000000..e69de29bb
diff --git a/client/coral-sign-in/components/Button.js b/client/coral-sign-in/components/Button.js
deleted file mode 100644
index 3f736ac3d..000000000
--- a/client/coral-sign-in/components/Button.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import React from 'react';
-import styles from './styles.css';
-
-const Button = ({type = 'local', children, className, ...props}) => (
-  <button
-    className={`${styles.button} ${styles[`type--${type}`]} ${className}`}
-    {...props}
-  >
-    {children}
-  </button>
-);
-
-export default Button;
diff --git a/client/coral-sign-in/components/FormField.js b/client/coral-sign-in/components/FormField.js
new file mode 100644
index 000000000..e69de29bb
diff --git a/client/coral-ui/components/Button.css b/client/coral-ui/components/Button.css
new file mode 100644
index 000000000..e69de29bb
diff --git a/client/coral-ui/components/Button.js b/client/coral-ui/components/Button.js
new file mode 100644
index 000000000..9c0d239b7
--- /dev/null
+++ b/client/coral-ui/components/Button.js
@@ -0,0 +1,13 @@
+import React from 'react';
+import styles from './styles.css';
+
+const Button = ({cStyle = 'local', children, className, ...props}) => (
+  <button
+    className={`${styles.button} ${styles[`type--${cStyle}`]} ${className}`}
+    {...props}
+  >
+    {children}
+  </button>
+);
+
+export default Button;
diff --git a/client/coral-ui/components/Spinner.css b/client/coral-ui/components/Spinner.css
new file mode 100644
index 000000000..00b7f93a5
--- /dev/null
+++ b/client/coral-ui/components/Spinner.css
@@ -0,0 +1,87 @@
+.container {
+    display: block;
+    text-align: center;
+}
+
+.spinner {
+    -webkit-animation: rotator 1.4s linear infinite;
+    animation: rotator 1.4s linear infinite;
+}
+
+@-webkit-keyframes rotator {
+    0% {
+        -webkit-transform: rotate(0deg);
+        transform: rotate(0deg);
+    }
+    100% {
+        -webkit-transform: rotate(270deg);
+        transform: rotate(270deg);
+    }
+}
+
+@keyframes rotator {
+    0% {
+        -webkit-transform: rotate(0deg);
+        transform: rotate(0deg);
+    }
+    100% {
+        -webkit-transform: rotate(270deg);
+        transform: rotate(270deg);
+    }
+}
+.path {
+    stroke-dasharray: 187;
+    stroke-dashoffset: 0;
+    -webkit-transform-origin: center;
+    transform-origin: center;
+    -webkit-animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
+    animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
+}
+
+@-webkit-keyframes colors {
+    0% {
+        stroke: #f67150;
+    }
+    100% {
+        stroke: #f6a47e;
+    }
+}
+
+@keyframes colors {
+    0% {
+        stroke: #f67150;
+    }
+    100% {
+        stroke: #f6a47e;
+    }
+}
+@-webkit-keyframes dash {
+    0% {
+        stroke-dashoffset: 187;
+    }
+    50% {
+        stroke-dashoffset: 46.75;
+        -webkit-transform: rotate(135deg);
+        transform: rotate(135deg);
+    }
+    100% {
+        stroke-dashoffset: 187;
+        -webkit-transform: rotate(450deg);
+        transform: rotate(450deg);
+    }
+}
+@keyframes dash {
+    0% {
+        stroke-dashoffset: 187;
+    }
+    50% {
+        stroke-dashoffset: 46.75;
+        -webkit-transform: rotate(135deg);
+        transform: rotate(135deg);
+    }
+    100% {
+        stroke-dashoffset: 187;
+        -webkit-transform: rotate(450deg);
+        transform: rotate(450deg);
+    }
+}
diff --git a/client/coral-ui/components/Spinner.js b/client/coral-ui/components/Spinner.js
new file mode 100644
index 000000000..058f1af7c
--- /dev/null
+++ b/client/coral-ui/components/Spinner.js
@@ -0,0 +1,12 @@
+import React from 'react';
+import styles from './Spinner.css';
+
+const Spinner = () => (
+  <div className={styles.container}>
+    <svg className={styles.spinner} width="40px" height="40px" viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">
+      <circle className={styles.path} fill="none" strokeWidth="6" strokeLinecap="round" cx="33" cy="33" r="30"></circle>
+    </svg>
+  </div>
+);
+
+export default Spinner;