Scattered-Thoughts: An HTML repository from rijfas

Scattered Thoughts

A simple blog web app using google sheets!
Open Deployed Project »

View Demo · Report Bug · Request Feature

Table of Contents

About The Project
- Built With
Getting Started
- Prerequisites
- Installation
Usage
Roadmap
Contributing
License
Contact
Acknowledgments

About The Project

There are many great social meadia/blog sites, but ever heard of a blog built with google sheets?, if no then here is one.

Major features:

Users can login !
Users can post their thoughts
They can logout too 😄

(back to top)

Built With

This web app is built within a short timespan, so major improvements on the way !!!. Main technologies used are:

(back to top)

Getting Started

The project is built on top of google sheets so the deployment is costless since it's just a front end.

Prerequisites

A google account is needed for creating a sheet and to connect with the fron end.

Installation

Create a new google sheet
Goto tools -> script editor
Paste the following code

var config = PropertiesService.getScriptProperties();

function setup() {
  var doc = SpreadsheetApp.getActiveSpreadsheet();
  config.setProperty("key", doc.getId());
}

function doGet(e) {
  var params = e.parameter;
  var myJSON = JSON.stringify(getDataFromSheet("Sheet1"));
  return ContentService.createTextOutput(myJSON).setMimeType(
    ContentService.MimeType.JSON
  );
}

function decodeUriMessage(message) {
  let decodedMessage = decodeURI(message);
  return decodedMessage.replace(/\+/g, " ");
}

function extractData(content) {
  content = JSON.parse(content);
  return [content.user, content.category, content.title, content.content];
}

function getTimeStamp() {
  const currentDate = new Date();
  return (
    currentDate.toLocaleTimeString() + ", " + currentDate.toLocaleDateString()
  );
}

function doPost(e) {
  var doc = SpreadsheetApp.openById(config.getProperty("key"));
  doc.appendRow([getTimeStamp(), ...extractData(e.postData.contents)]);
  return ContentService.createTextOutput(
    JSON.stringify(extractData(e.postData))
  ).setMimeType(ContentService.MimeType.JSON);
}

function getDataFromSheet(table) {
  try {
    var doc = SpreadsheetApp.openById(config.getProperty("key"));
    var sheet = doc.getSheetByName(table);

    if (!sheet) {
      return {
        status: "table not found",
      };
    }

    var header = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0];
    var data = sheet
      .getRange(2, 1, sheet.getLastRow() - 1, sheet.getLastColumn())
      .getValues();

    var result = data.map(function (values, index, array) {
      var obj = {};
      for (var i = 0; i < header.length; i++) {
        obj[header[i]] = values[i];
      }
      return obj;
    });

    return result;
  } catch (e) {
    return {
      status: "error",
      description: e,
    };
  }
}

save and run setup()
Deploy as webapp
Get deployment url
set deployment url in js

(back to top)

Usage

Users can login and add new posts logout..etc.

For more examples, please refer to the Documentation

(back to top)

Roadmap

Create base platform
Ability to create posts
[] Ability to delete posts
[] Ability to edit posts
[] Extra features
- [] Custom emoji
- [] Filtered posts

See the open issues for a full list of proposed features (and known issues).

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!