Skip to content

Instantly share code, notes, and snippets.

View considine's full-sized avatar

Jack Considine considine

17 followers · 8 following
View GitHub Profile
@considine
considine / app.js
Created August 24, 2018 22:23
// login component etc above
Vue.component("home-component", {
template : "<div> \
<h1> Hello World! </h1> \
</div>"
})
// Vue initialization and mounting below
@considine
considine / index.html
Created August 24, 2018 22:26
<div id="app">
<home-component></home-component>
</div>
@considine
considine / app.js
Created August 24, 2018 22:28
// Your corresponding keys
Parse.initialize("YOUR_APP_ID", "YOUR_JAVASCRIPT_KEY");
// For back4app applications, this url is
// 'https://parseapi.back4app.com'
Parse.serverURL = 'YOUR_SERVER_URL'
// Assign LoginComponent
const LoginComponent = Vue.component('login-component', {
@considine
considine / index.html
Created August 24, 2018 22:29
With a router
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>My Application</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
crossorigin="anonymous">
<link rel="stylesheet" href="css/signin.css">
@considine
considine / app.js
Created August 24, 2018 22:34
const LoginComponent = Vue.component('login-component', {
template: '<div class="signin-wrapper text-center"> \
<form class="form-signin"> \
<h1 class="h3 mb-3 font-weight-normal">Please sign in</h1> \
<label for="inputEmail" class="sr-only">Email address</label> \
<input v-model="email" type="email" id="inputEmail" class="form-control" placeholder="Email address" required="" autofocus=""> \
<label for="inputPassword" class="sr-only">Password</label> \
<input v-model="password" type="password" id="inputPassword" class="form-control" placeholder="Password" required=""> \
<button v-on:click="login" class="btn btn-lg btn-primary btn-block" type="button">Sign in</button> \
<p class="mt-5 mb-3 text-muted">© 2017-2018</p> \
@considine
considine / app.js
Last active August 24, 2018 22:36
redirect to login if no user
const HomeComponent = Vue.component("home-component", {
  template : "<div> \
  <h1> Hello World! </h1> \
  </div>",
  mounted : function () {
    if (!Parse.User.current()) {
      this.$router.replace("/login");
    }
  }
})
@considine
considine / app.js
Created August 24, 2018 22:38
finish step 8
// Your corresponding keys
Parse.initialize("YOUR_APP_ID", "YOUR_JAVASCRIPT_KEY");
// For back4app applications, this url is
// 'https://parseapi.back4app.com'
Parse.serverURL = 'YOUR_SERVER_URL'
const LoginComponent = Vue.component('login-component', {
template: '<div class="signin-wrapper text-center"> \
@considine
considine / index.html
Created August 24, 2018 22:39
Final
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>My Application</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
crossorigin="anonymous">
<link rel="stylesheet" href="css/signin.css">
@considine
considine / app.js
Last active August 24, 2018 22:43
Home Component final
const HomeComponent = Vue.component("home-component", {
template: "<div> \
<button class='btn btn-secondary m-2' v-on:click='logout'> Logout </button> \
<div class='container'>\
<input style='max-width: 500px;' class='form-control mx-auto' type='text' v-model='newTodo' v-on:keyup.enter='addTodo'> \
<div style='max-width: 500px;' class='card mx-auto' v-for='todo in todos'> \
<div class='card-body'> \
<button v-on:click='deleteTodo(todo)' type='button' class='close'> \
<span>&times;</span> \
</button> \
@considine
considine / app.js
Created August 24, 2018 22:44
ACLs in the addTodo method
// addTodo method of the HomeComponent.
// Rest of the code found on the repo: https://github.com/considine/parse-vue-starter/blob/master/js/app.js
addTodo() {
if (!this.newTodo || this.newTodo.length === 0) return;
var todo_acl = new Parse.ACL();
todo_acl.setWriteAccess( Parse.User.current(), true);
todo_acl.setPublicReadAccess( true);
var todoParseObject = new Parse.Object("Todo", {