Is your marketing team frustrated with having to wait for simple website updates? Is their team already using Monday.com, the team management tool? If so, we have a quick and easy solution to give non-technical people a structured and limited way to make updates to a webpage (without fearing they’ll mess up the site!) right from within Monday by using — it’s a win-win solution. Reshuffle Open Source ( : ) Disclosure The author is building Reshuffle Plus, by using the Monday interface that they’re already used to, marketers won’t have to deal with yet one more tool. Let’s say Marketing wants to continually add more customer case stories to the Customer Story web page. It’s a repeatable process and one that always contains the same content components (title, copy, image). You can give Marketing the autonomy they need to update this page themselves while staying within the parameters you set for the site. By creating a web page spreadsheet template in Monday.com that defines the components for the page, you can use Reshuffle’s connectors to integrate the spreadsheet to the website, and enable marketers to make updates in the spreadsheet that will automatically publish on the site. Marketers just need to fill in the component fields in the Monday spreadsheet and Reshuffle will publish it to the website! Reshuffle’s open source integration framework makes it easy. In this article, learn how to build a spreadsheet-powered website using Monday that lets people make changes to the website without the web team having to worry. How to Build It Reshuffle makes it easy to build integrations that complete complex tasks, so you can deliver unique experiences and outcomes for the business and for customers. Here’s how you’d build a spreadsheet powered website: Reshuffle is an open source, lightweight, and event-driven framework that helps you integrate services — these integrations and workflows are created inside a Reshuffle App. The objects that let you interact with these services are called . The first thing we need to do is to declare a Reshuffle App and a : connectors Monday connector { Reshuffle } = ( ) { MondayConnector } = ( ) app = Reshuffle() monday = MondayConnector(app, { : process.env.MONDAY_API_TOKEN
}) const require 'reshuffle' const require 'reshuffle-monday-connector' const new const new Token To get your Monday API token, log in to your Monday account and click on your Avatar in the bottom left. In the Admin panel, you'll find an API section, where you can create an API v2 token that you can plop into your local environment. You can also specify your and your address in the connector - but the first will be understood from the API key (unless you have multiple sites), and the second defaults to , which shouldn't conflict with any other addresses you're likely to have. `baseURL` `webhooks` `/webooks/monday` Next, we need to define the board and events we want to watch using the method, and our logic for what happens when we make a change. To find your boardId, go to your Monday board in your browser and copy it from the URL: `on()` All of the Monday connector events Reshuffle  supports can be found . In this example, we'll watch for a event, and then log the response: here `CreateItem` monday.on({ : , : }, (event, app) => { .log( , event)
}) boardId 895666799 type 'CreateItem' console 'Monday response:' Lastly, let's initiate the integration by starting the Reshuffle App: app.start(); To run this code locally in a development environment, we put the above code (only six lines!) in an file, and, after using npm to install the necessary packages, run it using . Then, we set up a Monday webhooks URL. To do this, go to the Monday settings (by clicking on your avatar in the bottom left, again), and clicking on "Integrations". Search for Webhooks. You'll want to set up a new webhook using your development URL. For this test, we used , by installing it and then running ` in another terminal window, which is the same port as our Node instance above. `index.js` `node index.js` ngrok ngrok http 8000` Take the URL that ngrok gives you, and add /webhooks/monday to it before adding it as the URL in the Webhook interface. And that's all you need to do. Go back to your sheet and create an item. We created a new item, called "toucan", because they're beautiful birds and we wanted Monday to display cool birds (why not?). You'll get a result similar to this: Monday response: { : , : , : , : , : , : , : , : , : , : , : , : , : , : , : , : , : , : , : } userId '17514907' originalTriggerUuid null boardId '895666799' groupId 'topics' itemId '902429084' pulseId '902429084' itemName 'Toucan' pulseName 'Toucan' columnId undefined columnType undefined columnTitle undefined value undefined previousValue undefined changedAt undefined isTopGroup true type 'CreateItem' triggerTime '2020-12-08T22:46:54.192Z' subscriptionId '29497386' triggerUuid 'a906a3fcd532060bcab0846b9e11e327' Your frontend should have a CMS which can interpret this data. Depending on the frontend, setting up a url which can capture POST requests will look slightly different. On our end, we need to post the resulting data above into a POST request. Here, we use the package: got monday.on({ : , : }, (event, app) => { { body } = got.post( , { : event, : }) .log(body.data)
}) boardId 895666799 type 'CreateItem' const await 'https://yourcms.org/newBoardItem' json responseType 'json' console And your front end should be able to capture this and display it however you like. In our really quite basic HTML frontend, we took the example above and rendered the JSON like this: Obviously, you'll want to do more than throw the JSON into a list on a basic HTML site. But that's where the fun is - once you've got a server taking new data from Monday using Reshuffle, the possibilities are endless. We hope you see how easy it is! You can do this quickly and really make updating your website easy for non-technical users. Now, Make it Happen As you work with your sales, marketing, and customer experience colleagues, we encourage you to build the integrations that drive better customer experiences and help differentiate your business in the marketplace. With teams using so many different tools, the more you can consolidate these tools into one common interface, and help automate workflows, the easier people can get work done. Reshuffle is continually listening to what our customers need and desire. Don’t see a Connector to a service you’d like to integrate? Send a tweet to to let us know which Connector you’d like us to develop next. @ReshuffleHQ ( : ) Disclosure The author is building Reshuffle

Different

Why You Shouldn't Use a Database as Your App’s Data Source

Read My Stories

Too Long; Didn't Read

Make resilience your competitive advantage

Update Your Website via Spreadsheets Using Monday.com and Reshuffle Open Source

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Untitled Story

Why You Shouldn't Use a Database as Your App’s Data Source

Why Being Likable At Work Matters

Windows Sticky Keys Exploit: The War Veteran That Never Dies

Zero People Charged With Online Pirating, Swedish Prosecutor's Office Reports

Is ‘bias for action’ making product managers lazier?

Why You Shouldn't Use a Database as Your App’s Data Source

Why Being Likable At Work Matters

Windows Sticky Keys Exploit: The War Veteran That Never Dies

Zero People Charged With Online Pirating, Swedish Prosecutor's Office Reports

Is ‘bias for action’ making product managers lazier?

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps