Merge pull request parse-community#92 from run-project/feature/test-s…

…creen

Add a page to assist users to test the parse server

README.md

@@ -87,7 +87,8 @@ A detailed tutorial is available here:
 
 # Using it
 
-You can use the REST API, the JavaScript SDK, and any of our open-source SDKs:
+Before using it, you can access a test page to verify if the basic setup is working fine [http://localhost:1337/test](http://localhost:1337/test).
+Then you can use the REST API, the JavaScript SDK, and any of our open-source SDKs:
 
 Example request to a server running locally:
 

index.js

@@ -3,6 +3,7 @@
 
 var express = require('express');
 var ParseServer = require('parse-server').ParseServer;
+var path = require('path');
 
 var databaseUri = process.env.DATABASE_URI || process.env.MONGOLAB_URI;
 
@@ -23,6 +24,9 @@ var api = new ParseServer({
 
 var app = express();
 
+// Config static middleware for assets
+app.use('/static', express.static(path.join(__dirname, '/public')));
+
 // Serve the Parse API on the /parse URL prefix
 var mountPath = process.env.PARSE_MOUNT || '/parse';
 app.use(mountPath, api);
@@ -32,6 +36,10 @@ app.get('/', function(req, res) {
   res.status(200).send('I dream of being a web site.');
 });
 
+app.get('/test', function(req, res) {
+  res.sendFile(path.join(__dirname, '/public/test.html'));
+});
+
 var port = process.env.PORT || 1337;
 app.listen(port, function() {
     console.log('parse-server-example running on port ' + port + '.');

package.json

@@ -1,6 +1,6 @@
 {
   "name": "parse-server-example",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "An example Parse API server using the parse-server module",
   "main": "index.js",
   "repository": {
@@ -9,7 +9,7 @@
   },
   "license": "MIT",
   "dependencies": {
-    "express": "~4.2.x",
+    "express": "~4.11.x",
     "kerberos": "~0.0.x",
     "parse": "~1.6.12",
     "parse-server": "~2.1.4"

public/assets/css/style.css

@@ -0,0 +1,238 @@
+body {
+  margin: 0;
+  padding: 0;
+  font-family: Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  letter-spacing: 0.2px;
+  line-height: 24px;
+  color: #585858;
+}
+
+a {
+  color: #169CEE;
+  text-decoration: underline;
+}
+
+a:hover {
+  color: #2C3D50;
+}
+
+a:visited {
+  color: #2a6496;
+}
+
+
+/*
+  helpers
+ */
+
+.align-center {
+  text-align: center;
+}
+
+.hidden {
+  display: none;
+}
+
+/*
+  app css
+ */
+
+.container {
+  margin: 0 auto;
+  margin-top: 45px;
+  max-width: 860px;
+}
+
+#parse-logo {
+  width: 109px;
+  height: 110px;
+  margin: 0 0 20px;
+  text-align: center;
+}
+
+.up-and-running, .time-to-deploy {
+  font-weight: bold;
+}
+
+.advice {
+  margin-bottom: 40px;
+}
+
+.advice {
+  background: #f4f4f4;
+  border-radius: 4px;
+  -webkit-border-radius: 4px 4px;
+  -moz-border-radius: 4px 4px;
+  -ms-border-radius: 4px 4px;
+  -o-border-radius: 4px 4px;
+  padding: 10px 20px;
+}
+
+#parse-url {
+  color: #169CEE;
+  font-weight: bold;
+}
+
+.step--container {
+  margin: 30px 0 20px;
+  border-top: 1px solid #E2E2E2;
+  padding-top: 30px;
+}
+
+/* Disabled step */
+.step--disabled .step--number {
+  background: #fff;
+  border-color: #B5B5B5;
+  color: #B5B5B5;
+}
+
+.step--disabled .step--info {
+  border-color: #B5B5B5;
+  color: #B5B5B5;
+}
+
+.step--disabled .step--action-btn,
+  .step--disabled .step--action-btn:hover {
+  border-color: #B5B5B5;
+  background: #fff;
+  color: #B5B5B5;
+  cursor: default;
+}
+
+/* Disabled step eof */
+
+.step--action-btn.success,
+.step--action-btn.success:hover {
+  background: #57C689;
+  border-color: #57C689;
+  color: #fff;
+  cursor: default;
+  font-weight: bold;
+}
+
+.step--number {
+  background: #169CEE;
+  border: 1px solid #169CEE;
+  border-radius: 28px;
+  -webkit-border-radius: 28px 28px;
+  -moz-border-radius: 28px 28px;
+  -ms-border-radius: 28px 28px;
+  -o-border-radius: 28px 28px;
+  display: block;
+  margin: auto;
+  width: 47px;
+  height: 47px;
+  font-weight: bolder;
+  font-size: 20px;
+  color: #FFFFFF;
+  line-height: 47px; /* follows width and height */
+}
+
+.step--info { }
+
+.step--action-btn {
+  color: #169CEE;
+  font-size: 14px;
+  font-weight: 100;
+  border: 1px solid #169CEE;
+  padding: 12px 18px;
+  border-radius: 28px;
+  -webkit-border-radius: 28px 28px;
+  -moz-border-radius: 28px 28px;
+  -ms-border-radius: 28px 28px;
+  -o-border-radius: 28px 28px;
+  cursor: pointer;
+  text-decoration: none;
+  display:inline-block;
+  text-align: center;
+  text-transform: uppercase;
+}
+
+.step--action-btn:hover {
+  background: #169CEE;
+  color: white;
+}
+
+.step--pre {
+  margin-top: 4px;
+  margin-bottom: 0;
+  background: #f4f4f4;
+  border-radius: 4px;
+  -webkit-border-radius: 4px 4px;
+  -moz-border-radius: 4px 4px;
+  -ms-border-radius: 4px 4px;
+  -o-border-radius: 4px 4px;
+  padding: 10px 20px;
+  word-wrap: break-word;
+  white-space: inherit;
+  font-size: 13px;
+}
+
+#local-parse-working {
+  font-size: 18px;
+  line-height: 24px;
+  color: #57C689;
+  font-weight: bold;
+}
+
+#step-4 .step--number {
+  background: #57C689;
+  border-color: #57C689;
+  color: #fff;
+  display: inline-block;
+}
+
+.step--deploy-btn {
+  display: block;
+  margin-top: 20px;
+  width: 170px;
+  color: #57C689 !important;
+  font-weight: bold;
+  border-color: #57C689;
+}
+
+.step--deploy-btn:hover {
+  background: #57C689;
+  color: #fff !important;
+}
+
+#prod-test {
+  margin-bottom: 60px;
+}
+
+#prod-test input {
+  background-color: #fff;
+  border: 1px solid #B5B5B5;
+  color: #000000;
+  font-family: "Inconsolata";
+  font-size: 16px;
+  line-height: 17px;
+  padding: 12px;
+  width: 260px;
+  border-radius: 4px;
+  -webkit-border-radius: 4px 4px;
+  -moz-border-radius: 4px 4px;
+  -ms-border-radius: 4px 4px;
+  -o-border-radius: 4px 4px;
+  display:block;
+  margin-bottom: 10px;
+}
+
+#footer {
+  border-top: 1px solid #E2E2E2;
+  padding: 20px;
+}
+
+#footer ul li {
+  list-style-type: none;
+  display:inline-block;
+}
+#footer ul li:after {
+  content: "-";
+  padding: 10px;
+}
+#footer ul li:last-child:after {
+  content: "";
+}
+