Load data from JSON file in assets with NUXT.js - json

Suppose I have assets/data/geo/regions.json file in my NUXT.js project folders structure. How can I read data from this file into my project?
I have tried axios but I don't know what URL will have this file, I have tried all possible URLs. What is the better solution to do that? Maybe better to hold JSON files in static folder?
Thanks!

If the regions.json file won't change, you can easily put it in the static folder.
Then the url will be /data/geo/regions.json
See this question on the nuxt issues page

You can import JSON files with import data from 'data.json' and use the data property straight in your component.

You may want to use "require" instead of "import" if you planning to load data within the loop.
jsons = ["json_one","json_two"]
jsons_readed = []
// In the loop
file = require(`./assets/data/geo/${jsons[i]}`)
jsons_readed.push(file)
Then I think you can use jsons_readed to access objects.

You can use Nuxt Content for that:
Empower your NuxtJS application with #nuxt/content module: write in a content/ directory and fetch your Markdown, JSON, YAML, XML and CSV files through a MongoDB like API, acting as a Git-based Headless CMS.
The basics are as easy as the following line. That will load the regions.json file, parse it, and store its content in the content variable. See Nuxt Content's documentation for more information about it.
const content = await this.$content('regions').fetch()
Alternatively you can read our blog post about
Using Nuxt Content with a JSON File. It describes how to extend existing pages with JSON content but also how to dynamically generate pages based on it.
Disclaimer: I work at FrontAid CMS.

Related

What would be the best way to write JSON in a locally stored file in React Native

Im currently working on a new design for a mobile app (only frontend). In the project I need to use states to change the css of a button. If the button has changed, next time the app is refreshed the state should be as you left it.
That is why I have a locally stored JSON file that is structured the same as how the apps current database is. Reading it is no issue, but I can't get the writing to work.
How I read the JSON:
const jsonData = require('../data.json')
function GetBaseState(id){
console.log(jsonData.bases[id].state)
}
How would I go about changing that state in the JSON file?
In order to both of reading and writing Json file , you are able to use react-native-fs. For example by readFile method you can read json file and by writeFile method writing your json file in local storage.
react-native-fs have good documents that you are able to reading that for more information and usage.

import json without caching the file (next.js or node.js)

I built an api with next.js.
I use a JSON file as a data source. I import it as a module. But if the content of the JSON changes, it still shows the first content, the same, when i started the server.
Is there a way to avoid caching JSON with import?
I need to get the JSON content, but also the updates in the JSON file, without restarting my api.
If your Server returns the JSON files with a specific File-Extension like .json you could try to turn off the caching for those file-types:
Here is an example for ngnix-servers
Here is an example for apache-servers
Another possibility is to load the JSON via Javascript where you add some random parameter to the Query-Params of the URL
Here is the Example

Loading static copy content from a JSON file into a Vue web site?

I'd like to use a .json file to load all of my content copy into my new Vue web site.
I'd like to import a file:
import Copy from '#/content/home.json';
Then have the content accessible to my template. My preference is to have the content file loaded in the page, then pass relevant data into components as props.
I hope that makes sense, my searches have pulled up all sorts of JSON/data related solutions but they all seem over-engineered for what I want.
If you need more info I will happily provide.

Open local JSON file for examination

I was wondering if it's possible to open a local JSON file so I can just check its structure? Didn't/don't want to upload the file to an online JSON format checker site and was hoping I can just utilize PAW to do that.
Don't seem to be able to do this with a local file, unless I run it through a local server, eg using MAMP, unless I missed something...?
Thanks.
You could copy the content into the txt body then switch to the JSON body this will let you view it in the nice structure, sorry currently no way to directly import a file need to copy past the content.
Take a look at jsonlint npm module. Supports JSON schema validation and pretty printing.

How do I generate a static html file from a django template?

I'm new to Django, and I'm pretty sure I've read or heard about a way to do this, but I can't find it anywhere.
Rather than sending the rendered output from a template to a browser, I want to create an html file that can then be served without the need to go through the rendering process every time. I'm developing on a system that's separate from our main website's server, and I need to make periodic snapshots of my data available to our users without giving them access to the development system.
My intuition says that I should be able to somehow redirect the response to a file, but I'm not seeing it in the docs or in other posts here.
You can leverage Django's template loader to render your template, including whatever context you pass to it, as a string and then save that out to the filesystem. If you need to save that file on an external system, such as Amazon S3, you can use the Boto library.
Here's an example of how to render a view to a file, using an optional querystring parameter as the trigger...
from django.shortcuts import render
from django.template.loader import render_to_string
def my_view(request):
as_file = request.GET.get('as_file')
context = {'some_key': 'some_value'}
if as_file:
content = render_to_string('your-template.html', context)
with open('path/to/your-template-static.html', 'w') as static_file:
static_file.write(content)
return render('your-template.html', context)
django-bakery is a well-developed "set of helpers for baking your Django site out as flat files".
There's a well developed Django app specifically for this: django-render-static