How do I autosave an array in a js file along with some text?

Question

I have a .js file that contains an array that will be imported as data. For example, it will look like this:

const ideasData = [
    {
        content:"Content",
        title: "This Title",
        date: new Date()
    },
    {
        content:"content2",
        title: "second title",
        date: new Date()
    }
]

export default ideasData

The export is necessary since I will import the data in another file. I use the data in the program and then will modify it throughout.

import ideasData from "./ideasData";
class Ideas extends Component{
    constructor() {
        super()
        this.state = {
            ideas : ideasData
        }}}

I want to overwrite the data in the file in a similar format(the array, then the export) every couple seconds as an autosave. So next time I open the webpage it will look like when it was closed.

I put a function autoSave() in the class and then setInterval(this.autoSave, 5000) in the render method before the return. I am not sure how to save the array, this.state.ideas to the ideasData file. Also, I am not sure about putting the setInterval in the render method. I changed it to setInterval(console.log("saved"),5000) and it seems to have only logged that in the console once.

https://stackoverflow.com/questions/13405129/javascript-create-and-save-file — Jabberwocky, Jun 06 '19 at 16:07
You could export a "set" method that updates the array as you save it. So when autoSave runs, it just sends the data to set, which updates the cached information — Sterling Archer, Jun 06 '19 at 16:08
Your code doesn't represent the core of your question. Does the issue you're having is with the `setInterval`? — GalAbra, Jun 06 '19 at 16:08
@Jabberwocky this isn't a file cache, it's just using a program cache — Sterling Archer, Jun 06 '19 at 16:09
@Jabberwocky the data is not downloaded by a user, it is saved to a local file — Lahel Light, Jun 06 '19 at 16:10
@LahelLight to clarify on Jabberwocky's point, you're using node to save the file to the local file system correct? — zfrisch, Jun 06 '19 at 16:12
@GalAbra State is created with data from file "ideasData.js". I want to be able to save the data in the state at regular intervals to the file "ideasData.js". So when I refresh the page, it will load the data from ideasData to state. — Lahel Light, Jun 06 '19 at 16:14
@zfrisch I think so, yes. I want the server to have a file stored in the server that it updates if that makes sense? — Lahel Light, Jun 06 '19 at 16:17
@SterlingArcher Like this? `function set(newIdeasData){ideasData = newIdeasData}` in the ideasData.js (stores data) file, then in the main file `autoSave() {set(this.state.ideas)}`. But how would I export both the array and the function? — Lahel Light, Jun 06 '19 at 16:20
@LahelLight yes :) I explained in more detail in an answer for you — Sterling Archer, Jun 06 '19 at 16:21

score 1 · Accepted Answer · answered Jun 06 '19 at 16:13

1

So, we already have your file here:

const ideasData = [
    {
        content:"Content",
        title: "This Title",
        date: new Date()
    },
    {
        content:"content2",
        title: "second title",
        date: new Date()
    }
]

export default ideasData

Now, all you have to do is export a set method (in the same file as the code above) such as:

export function update(newData) {
    ideasData = newData;
}

You will have to change const to let in order to mutate it, otherwise you can just clear it and push the new data in, or you could create a Class with it's own state. Either way.

Now, when setInterval(this.autoSave, 5000) runs, just import the new update function as well, and call update(this.state.ideas) to update your data cache.

answered Jun 06 '19 at 16:13

Sterling Archer

22,070
18
81
118

How do I import it? Like this? `import ideasData from "./ideasData";` `import update from "./ideasData"` Since I already imported the data from this file. Also, I just pasted the "export function update(newdata)" at the end of the ideasData file. Does that work? – Lahel Light Jun 06 '19 at 16:25
Importing will be a little different since one is a default export and the other is a regular. I believe it would be more like `import ideasData, { update } from "./ideasData";` – Sterling Archer Jun 06 '19 at 16:28
Hm, there's no more errors anymore, but my file isn't updating. I put the setinterval inside a componentDidMount like this: `componentDidMount(){setInterval(this.autoSave,5000)}`. I replaced it with a `console.log("saved")` and that just consoled when I refreshed and only once. – Lahel Light Jun 06 '19 at 16:44
Try some debugging -- does the function have proper binding so it knows what context of `this` to use? – Sterling Archer Jun 06 '19 at 16:45
I binded both `autoSave` and `componentDidMount` to `this`. But I think setInterval does not run properly? I changed it to `componentDidMount(){setInterval(console.log(Math.random()),1000)}` to test it. But my console only has one log in it – Lahel Light Jun 06 '19 at 16:52

How do I autosave an array in a js file along with some text?

1 Answers1