Mixing
Timeout connection on firebase createUserWithEmailAndPassword
0
I'm getting the following error
A network error (such as timeout, interrupted connection or
unreachable host) has occurred.
This demo technically works on stackblitz.com(a new user will populate on the firebase backed). Will not work on the localserver.
The localhost is whitelisted.
https://stackblitz.com/edit/react-gr9qck
actions.js
import { auth as firebaseAuth } from '../firebaseConfig'
export const EMAIL_SIGN_UP_CHANGE = 'EMAIL_SIGN_UP_CHANGE';
export const PASSWORD_SIGN_UP_CHANGE = 'PASSWORD_SIGN_UP_CHANGE';
export const onEmailSignUpChangeAction = value => ({
type: EMAIL_SIGN_UP_CHANGE,
email: value
})
export const onPasswordSignUpChangeAction = value => ({
type: PASSWORD_SIGN_UP_CHANGE,
password: value
})
export const onEmptySignUpEmailClick = () => ({
type: 'EMPTY_SIGN_UP_EMAIL'
})
export const onEmptySignUpPasswordClick = () => ({
type: 'EMPTY_SIGN_UP_PASSWORD'
})
export const signUp = () => (dispatch, getState) => {
const {signUpAuth} = getState();
if (signUpAuth.emailSignUp === '') {
dispatch(onEmptySignUpEmailClick())
}
if (signUpAuth.passwordSignUp === '') { dispatch(onEmptySignUpPasswordClick()) }
else {
firebaseAuth.createUserWithEmailAndPassword(signUpAuth.emailSignUp, signUpAuth.passwordSignUp)
.catch( function (error) {
let errorCode = error.code;
let errorMessage = error.message;
alert(errorMessage)
})
}
}
firebaseConfig(astericked for protection)
import firebase from 'firebase'
const config = {
apiKey: "******",
authDomain: "*****",
databaseURL: "****",
projectId: "******",
storageBucket: "******",
messagingSenderId: "*******"
};
firebase.initializeApp(config);
export const database = firebase.database()
export const auth = firebase.auth()
export const googleProvider = new firebase.auth.GoogleAuthProvider()
SignUp.js
import React, {Component} from 'react';
import { withRouter } from "react-router-dom";
import { connect } from "react-redux";
import {signUp ,onEmailSignUpChangeAction,onPasswordSignUpChangeAction} from '../actions/';
class SignUp extends Component {
state = {
email: "",
password: ""
}
// onChange = (e) =>{
// this.setState({
// [e.target.name] : e.target.value
// })
// }
// handleSubmit = (e) =>{
// e.preventDefault();
// this.props.signUp(this.state);
// // (register === true) && this.props.history.push('/');
// // console.log(this.state);
// }
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6">
<h1>Sign Up</h1>
<form onSubmit={this.props.signUp}>
<div className="form-group">
<label for="exampleInputEmail1">Email address</label>
<input
type="email"
className="form-control"
id="email"
onChange={this.props.onEmailSignUpChangeAction}
aria-describedby="emailHelp"
value={this.props.emailSignUp}
placeholder="Enter email"/>
<small id="emailHelp" className="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div className="form-group">
<label for="exampleInputPassword1">Password</label>
<input
type="password"
className="form-control"
id="password"
value={this.props.passwordSignUp}
onChange={this.props.onPasswordSignUpChangeAction}
placeholder="Password"/>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
);
}
}
const mapStateToProps = (state) => ({
user: state.auth.user,
emailSignUp:state.signUpAuth.emailSignUp,
passwordSignUp:state.signUpAuth.passwordSignUp
})
const mapDispatchToProps = (dispatch) => ({
signUp: () => dispatch(signUp()),
onEmailSignUpChangeAction: (event) => dispatch(onEmailSignUpChangeAction(event.target.value)),
onPasswordSignUpChangeAction: (event) => dispatch(onPasswordSignUpChangeAction(event.target.value)),
});
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(SignUp));
signUpReducer
import { PASSWORD_SIGN_UP_CHANGE, EMAIL_SIGN_UP_CHANGE} from '../actions';
const initialState = {
emailSignUp: '',
passwordSignUp: ''
}
export default (state = initialState, action) => {
switch (action.type) {
case EMAIL_SIGN_UP_CHANGE:
return {
...state,
emailSignUp: action.email
}
case PASSWORD_SIGN_UP_CHANGE:
return {
...state,
passwordSignUp: action.password
}
default:
return state
}
}
javascript reactjs firebase redux firebase-authentication
asked Jan 1 at 23:28
BARNOWLBARNOWL
4841821
add a comment |
0
I'm getting the following error
A network error (such as timeout, interrupted connection or
unreachable host) has occurred.
This demo technically works on stackblitz.com(a new user will populate on the firebase backed). Will not work on the localserver.
The localhost is whitelisted.
https://stackblitz.com/edit/react-gr9qck
actions.js
import { auth as firebaseAuth } from '../firebaseConfig'
export const EMAIL_SIGN_UP_CHANGE = 'EMAIL_SIGN_UP_CHANGE';
export const PASSWORD_SIGN_UP_CHANGE = 'PASSWORD_SIGN_UP_CHANGE';
export const onEmailSignUpChangeAction = value => ({
type: EMAIL_SIGN_UP_CHANGE,
email: value
})
export const onPasswordSignUpChangeAction = value => ({
type: PASSWORD_SIGN_UP_CHANGE,
password: value
})
export const onEmptySignUpEmailClick = () => ({
type: 'EMPTY_SIGN_UP_EMAIL'
})
export const onEmptySignUpPasswordClick = () => ({
type: 'EMPTY_SIGN_UP_PASSWORD'
})
export const signUp = () => (dispatch, getState) => {
const {signUpAuth} = getState();
if (signUpAuth.emailSignUp === '') {
dispatch(onEmptySignUpEmailClick())
}
if (signUpAuth.passwordSignUp === '') { dispatch(onEmptySignUpPasswordClick()) }
else {
firebaseAuth.createUserWithEmailAndPassword(signUpAuth.emailSignUp, signUpAuth.passwordSignUp)
.catch( function (error) {
let errorCode = error.code;
let errorMessage = error.message;
alert(errorMessage)
})
}
}
firebaseConfig(astericked for protection)
import firebase from 'firebase'
const config = {
apiKey: "******",
authDomain: "*****",
databaseURL: "****",
projectId: "******",
storageBucket: "******",
messagingSenderId: "*******"
};
firebase.initializeApp(config);
export const database = firebase.database()
export const auth = firebase.auth()
export const googleProvider = new firebase.auth.GoogleAuthProvider()
SignUp.js
import React, {Component} from 'react';
import { withRouter } from "react-router-dom";
import { connect } from "react-redux";
import {signUp ,onEmailSignUpChangeAction,onPasswordSignUpChangeAction} from '../actions/';
class SignUp extends Component {
state = {
email: "",
password: ""
}
// onChange = (e) =>{
// this.setState({
// [e.target.name] : e.target.value
// })
// }
// handleSubmit = (e) =>{
// e.preventDefault();
// this.props.signUp(this.state);
// // (register === true) && this.props.history.push('/');
// // console.log(this.state);
// }
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6">
<h1>Sign Up</h1>
<form onSubmit={this.props.signUp}>
<div className="form-group">
<label for="exampleInputEmail1">Email address</label>
<input
type="email"
className="form-control"
id="email"
onChange={this.props.onEmailSignUpChangeAction}
aria-describedby="emailHelp"
value={this.props.emailSignUp}
placeholder="Enter email"/>
<small id="emailHelp" className="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div className="form-group">
<label for="exampleInputPassword1">Password</label>
<input
type="password"
className="form-control"
id="password"
value={this.props.passwordSignUp}
onChange={this.props.onPasswordSignUpChangeAction}
placeholder="Password"/>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
);
}
}
const mapStateToProps = (state) => ({
user: state.auth.user,
emailSignUp:state.signUpAuth.emailSignUp,
passwordSignUp:state.signUpAuth.passwordSignUp
})
const mapDispatchToProps = (dispatch) => ({
signUp: () => dispatch(signUp()),
onEmailSignUpChangeAction: (event) => dispatch(onEmailSignUpChangeAction(event.target.value)),
onPasswordSignUpChangeAction: (event) => dispatch(onPasswordSignUpChangeAction(event.target.value)),
});
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(SignUp));
signUpReducer
import { PASSWORD_SIGN_UP_CHANGE, EMAIL_SIGN_UP_CHANGE} from '../actions';
const initialState = {
emailSignUp: '',
passwordSignUp: ''
}
export default (state = initialState, action) => {
switch (action.type) {
case EMAIL_SIGN_UP_CHANGE:
return {
...state,
emailSignUp: action.email
}
case PASSWORD_SIGN_UP_CHANGE:
return {
...state,
passwordSignUp: action.password
}
default:
return state
}
}
javascript reactjs firebase redux firebase-authentication
asked Jan 1 at 23:28
BARNOWLBARNOWL
4841821
add a comment |
0
0
0
I'm getting the following error
A network error (such as timeout, interrupted connection or
unreachable host) has occurred.
This demo technically works on stackblitz.com(a new user will populate on the firebase backed). Will not work on the localserver.
The localhost is whitelisted.
https://stackblitz.com/edit/react-gr9qck
actions.js
import { auth as firebaseAuth } from '../firebaseConfig'
export const EMAIL_SIGN_UP_CHANGE = 'EMAIL_SIGN_UP_CHANGE';
export const PASSWORD_SIGN_UP_CHANGE = 'PASSWORD_SIGN_UP_CHANGE';
export const onEmailSignUpChangeAction = value => ({
type: EMAIL_SIGN_UP_CHANGE,
email: value
})
export const onPasswordSignUpChangeAction = value => ({
type: PASSWORD_SIGN_UP_CHANGE,
password: value
})
export const onEmptySignUpEmailClick = () => ({
type: 'EMPTY_SIGN_UP_EMAIL'
})
export const onEmptySignUpPasswordClick = () => ({
type: 'EMPTY_SIGN_UP_PASSWORD'
})
export const signUp = () => (dispatch, getState) => {
const {signUpAuth} = getState();
if (signUpAuth.emailSignUp === '') {
dispatch(onEmptySignUpEmailClick())
}
if (signUpAuth.passwordSignUp === '') { dispatch(onEmptySignUpPasswordClick()) }
else {
firebaseAuth.createUserWithEmailAndPassword(signUpAuth.emailSignUp, signUpAuth.passwordSignUp)
.catch( function (error) {
let errorCode = error.code;
let errorMessage = error.message;
alert(errorMessage)
})
}
}
firebaseConfig(astericked for protection)
import firebase from 'firebase'
const config = {
apiKey: "******",
authDomain: "*****",
databaseURL: "****",
projectId: "******",
storageBucket: "******",
messagingSenderId: "*******"
};
firebase.initializeApp(config);
export const database = firebase.database()
export const auth = firebase.auth()
export const googleProvider = new firebase.auth.GoogleAuthProvider()
SignUp.js
import React, {Component} from 'react';
import { withRouter } from "react-router-dom";
import { connect } from "react-redux";
import {signUp ,onEmailSignUpChangeAction,onPasswordSignUpChangeAction} from '../actions/';
class SignUp extends Component {
state = {
email: "",
password: ""
}
// onChange = (e) =>{
// this.setState({
// [e.target.name] : e.target.value
// })
// }
// handleSubmit = (e) =>{
// e.preventDefault();
// this.props.signUp(this.state);
// // (register === true) && this.props.history.push('/');
// // console.log(this.state);
// }
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6">
<h1>Sign Up</h1>
<form onSubmit={this.props.signUp}>
<div className="form-group">
<label for="exampleInputEmail1">Email address</label>
<input
type="email"
className="form-control"
id="email"
onChange={this.props.onEmailSignUpChangeAction}
aria-describedby="emailHelp"
value={this.props.emailSignUp}
placeholder="Enter email"/>
<small id="emailHelp" className="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div className="form-group">
<label for="exampleInputPassword1">Password</label>
<input
type="password"
className="form-control"
id="password"
value={this.props.passwordSignUp}
onChange={this.props.onPasswordSignUpChangeAction}
placeholder="Password"/>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
);
}
}
const mapStateToProps = (state) => ({
user: state.auth.user,
emailSignUp:state.signUpAuth.emailSignUp,
passwordSignUp:state.signUpAuth.passwordSignUp
})
const mapDispatchToProps = (dispatch) => ({
signUp: () => dispatch(signUp()),
onEmailSignUpChangeAction: (event) => dispatch(onEmailSignUpChangeAction(event.target.value)),
onPasswordSignUpChangeAction: (event) => dispatch(onPasswordSignUpChangeAction(event.target.value)),
});
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(SignUp));
signUpReducer
import { PASSWORD_SIGN_UP_CHANGE, EMAIL_SIGN_UP_CHANGE} from '../actions';
const initialState = {
emailSignUp: '',
passwordSignUp: ''
}
export default (state = initialState, action) => {
switch (action.type) {
case EMAIL_SIGN_UP_CHANGE:
return {
...state,
emailSignUp: action.email
}
case PASSWORD_SIGN_UP_CHANGE:
return {
...state,
passwordSignUp: action.password
}
default:
return state
}
}
javascript reactjs firebase redux firebase-authentication
asked Jan 1 at 23:28
BARNOWLBARNOWL
4841821
I'm getting the following error
A network error (such as timeout, interrupted connection or
unreachable host) has occurred.
This demo technically works on stackblitz.com(a new user will populate on the firebase backed). Will not work on the localserver.
The localhost is whitelisted.
https://stackblitz.com/edit/react-gr9qck
actions.js
import { auth as firebaseAuth } from '../firebaseConfig'
export const EMAIL_SIGN_UP_CHANGE = 'EMAIL_SIGN_UP_CHANGE';
export const PASSWORD_SIGN_UP_CHANGE = 'PASSWORD_SIGN_UP_CHANGE';
export const onEmailSignUpChangeAction = value => ({
type: EMAIL_SIGN_UP_CHANGE,
email: value
})
export const onPasswordSignUpChangeAction = value => ({
type: PASSWORD_SIGN_UP_CHANGE,
password: value
})
export const onEmptySignUpEmailClick = () => ({
type: 'EMPTY_SIGN_UP_EMAIL'
})
export const onEmptySignUpPasswordClick = () => ({
type: 'EMPTY_SIGN_UP_PASSWORD'
})
export const signUp = () => (dispatch, getState) => {
const {signUpAuth} = getState();
if (signUpAuth.emailSignUp === '') {
dispatch(onEmptySignUpEmailClick())
}
if (signUpAuth.passwordSignUp === '') { dispatch(onEmptySignUpPasswordClick()) }
else {
firebaseAuth.createUserWithEmailAndPassword(signUpAuth.emailSignUp, signUpAuth.passwordSignUp)
.catch( function (error) {
let errorCode = error.code;
let errorMessage = error.message;
alert(errorMessage)
})
}
}
firebaseConfig(astericked for protection)
import firebase from 'firebase'
const config = {
apiKey: "******",
authDomain: "*****",
databaseURL: "****",
projectId: "******",
storageBucket: "******",
messagingSenderId: "*******"
};
firebase.initializeApp(config);
export const database = firebase.database()
export const auth = firebase.auth()
export const googleProvider = new firebase.auth.GoogleAuthProvider()
SignUp.js
import React, {Component} from 'react';
import { withRouter } from "react-router-dom";
import { connect } from "react-redux";
import {signUp ,onEmailSignUpChangeAction,onPasswordSignUpChangeAction} from '../actions/';
class SignUp extends Component {
state = {
email: "",
password: ""
}
// onChange = (e) =>{
// this.setState({
// [e.target.name] : e.target.value
// })
// }
// handleSubmit = (e) =>{
// e.preventDefault();
// this.props.signUp(this.state);
// // (register === true) && this.props.history.push('/');
// // console.log(this.state);
// }
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6">
<h1>Sign Up</h1>
<form onSubmit={this.props.signUp}>
<div className="form-group">
<label for="exampleInputEmail1">Email address</label>
<input
type="email"
className="form-control"
id="email"
onChange={this.props.onEmailSignUpChangeAction}
aria-describedby="emailHelp"
value={this.props.emailSignUp}
placeholder="Enter email"/>
<small id="emailHelp" className="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div className="form-group">
<label for="exampleInputPassword1">Password</label>
<input
type="password"
className="form-control"
id="password"
value={this.props.passwordSignUp}
onChange={this.props.onPasswordSignUpChangeAction}
placeholder="Password"/>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
);
}
}
const mapStateToProps = (state) => ({
user: state.auth.user,
emailSignUp:state.signUpAuth.emailSignUp,
passwordSignUp:state.signUpAuth.passwordSignUp
})
const mapDispatchToProps = (dispatch) => ({
signUp: () => dispatch(signUp()),
onEmailSignUpChangeAction: (event) => dispatch(onEmailSignUpChangeAction(event.target.value)),
onPasswordSignUpChangeAction: (event) => dispatch(onPasswordSignUpChangeAction(event.target.value)),
});
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(SignUp));
signUpReducer
import { PASSWORD_SIGN_UP_CHANGE, EMAIL_SIGN_UP_CHANGE} from '../actions';
const initialState = {
emailSignUp: '',
passwordSignUp: ''
}
export default (state = initialState, action) => {
switch (action.type) {
case EMAIL_SIGN_UP_CHANGE:
return {
...state,
emailSignUp: action.email
}
case PASSWORD_SIGN_UP_CHANGE:
return {
...state,
passwordSignUp: action.password
}
default:
return state
}
}
javascript reactjs firebase redux firebase-authentication
javascript reactjs firebase redux firebase-authentication
asked Jan 1 at 23:28
BARNOWLBARNOWL
4841821
asked Jan 1 at 23:28
BARNOWLBARNOWL
4841821
edited Jan 1 at 23:34
BARNOWL
asked Jan 1 at 23:28
BARNOWLBARNOWL
4841821
asked Jan 1 at 23:28
BARNOWLBARNOWL
4841821
asked Jan 1 at 23:28
BARNOWLBARNOWL
4841821
4841821
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
0
I refactored the code. instead of Using the form tags.
I referenced this
Can't Sign up with firebase
SignUp.js
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6">
<h1>Sign Up</h1>
<div onClick={this.props.signUp}>
<div className="form-group">
<label htmlFor="exampleInputEmail1">Email address</label>
<input
type="email"
className="form-control"
id="email"
onChange={this.props.onEmailSignUpChangeAction}
aria-describedby="emailHelp"
value={this.props.emailSignUp}
placeholder="Enter email"/>
<small id="emailHelp" className="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div className="form-group">
<label htmlFor="exampleInputPassword1">Password</label>
<input
type="password"
className="form-control"
id="password"
value={this.props.passwordSignUp}
onChange={this.props.onPasswordSignUpChangeAction}
placeholder="Password"/>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</div>
</div>
</div>
</div>
);
}
answered Jan 2 at 4:15
BARNOWLBARNOWL
4841821
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53999750%2ftimeout-connection-on-firebase-createuserwithemailandpassword%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
I refactored the code. instead of Using the form tags.
I referenced this
Can't Sign up with firebase
SignUp.js
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6">
<h1>Sign Up</h1>
<div onClick={this.props.signUp}>
<div className="form-group">
<label htmlFor="exampleInputEmail1">Email address</label>
<input
type="email"
className="form-control"
id="email"
onChange={this.props.onEmailSignUpChangeAction}
aria-describedby="emailHelp"
value={this.props.emailSignUp}
placeholder="Enter email"/>
<small id="emailHelp" className="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div className="form-group">
<label htmlFor="exampleInputPassword1">Password</label>
<input
type="password"
className="form-control"
id="password"
value={this.props.passwordSignUp}
onChange={this.props.onPasswordSignUpChangeAction}
placeholder="Password"/>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</div>
</div>
</div>
</div>
);
}
answered Jan 2 at 4:15
BARNOWLBARNOWL
4841821
add a comment |
0
I refactored the code. instead of Using the form tags.
I referenced this
Can't Sign up with firebase
SignUp.js
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6">
<h1>Sign Up</h1>
<div onClick={this.props.signUp}>
<div className="form-group">
<label htmlFor="exampleInputEmail1">Email address</label>
<input
type="email"
className="form-control"
id="email"
onChange={this.props.onEmailSignUpChangeAction}
aria-describedby="emailHelp"
value={this.props.emailSignUp}
placeholder="Enter email"/>
<small id="emailHelp" className="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div className="form-group">
<label htmlFor="exampleInputPassword1">Password</label>
<input
type="password"
className="form-control"
id="password"
value={this.props.passwordSignUp}
onChange={this.props.onPasswordSignUpChangeAction}
placeholder="Password"/>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</div>
</div>
</div>
</div>
);
}
answered Jan 2 at 4:15
BARNOWLBARNOWL
4841821
add a comment |
0
0
0
I refactored the code. instead of Using the form tags.
I referenced this
Can't Sign up with firebase
SignUp.js
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6">
<h1>Sign Up</h1>
<div onClick={this.props.signUp}>
<div className="form-group">
<label htmlFor="exampleInputEmail1">Email address</label>
<input
type="email"
className="form-control"
id="email"
onChange={this.props.onEmailSignUpChangeAction}
aria-describedby="emailHelp"
value={this.props.emailSignUp}
placeholder="Enter email"/>
<small id="emailHelp" className="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div className="form-group">
<label htmlFor="exampleInputPassword1">Password</label>
<input
type="password"
className="form-control"
id="password"
value={this.props.passwordSignUp}
onChange={this.props.onPasswordSignUpChangeAction}
placeholder="Password"/>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</div>
</div>
</div>
</div>
);
}
answered Jan 2 at 4:15
BARNOWLBARNOWL
4841821
I refactored the code. instead of Using the form tags.
I referenced this
Can't Sign up with firebase
SignUp.js
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6">
<h1>Sign Up</h1>
<div onClick={this.props.signUp}>
<div className="form-group">
<label htmlFor="exampleInputEmail1">Email address</label>
<input
type="email"
className="form-control"
id="email"
onChange={this.props.onEmailSignUpChangeAction}
aria-describedby="emailHelp"
value={this.props.emailSignUp}
placeholder="Enter email"/>
<small id="emailHelp" className="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div className="form-group">
<label htmlFor="exampleInputPassword1">Password</label>
<input
type="password"
className="form-control"
id="password"
value={this.props.passwordSignUp}
onChange={this.props.onPasswordSignUpChangeAction}
placeholder="Password"/>
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</div>
</div>
</div>
</div>
);
}
answered Jan 2 at 4:15
BARNOWLBARNOWL
4841821
answered Jan 2 at 4:15
BARNOWLBARNOWL
4841821
answered Jan 2 at 4:15
BARNOWLBARNOWL
4841821
answered Jan 2 at 4:15
BARNOWLBARNOWL
4841821
4841821
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53999750%2ftimeout-connection-on-firebase-createuserwithemailandpassword%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
