How can I view pdf files from an API with Vue Js? - django

Hello friends I need your support.. I am currently developing an app with django rest framework in the backend and vue js in the frontend.. the app consists of saving pdf files, which I can list in a table.. but the problem is that it only I can see by table the path where they are saved and I have not been able to view the files. Can someone tell me how I can place a button to view these files?
I have tried functions to download the files but I have not achieved a solution

Related

How to build API that will return HTML for the site and JSON for other clients

I have started learning DRF just a while ago and had a little question -
how can I code one API that will return HTML for the site that I am currently working on and return JSON format for other "clients"(e.g. mobile apps, desktop, etc)?
I have tried to search for this information, but didn't found any answering content.
The only way I see is to create default Django views for the site and create separated API's for other requests. Can anybody tell me if I am right and need to do so, or there is some code that is solving my problem?
Ultimately, you can think of it as a whole separate set of views, urls and instead of models you have a serializer. Within you're app you can create an API folder. Within that directory you will need to have an '_ _ init _ _.py', 'urls.py', 'views.py' and a 'serializers.py'. Its analogous to creating a standard url, view, model structure to display an HTML page, but without the HTML template. Make distinct urls for the serializers too. For example for login do something like this:
path('my_app_api/login', serializer_view)
Youtube has tons of videos if you search django rest framework

What is the original purpose of Django apps? What are the use cases of Django apps?

I'm building a website that'll use a Bootstrap template similar to the image shown below. I intend to add an authentication and authorization functionality using OAuth 2. The main menu will consist of:
Homepage link
Statistics app link
NLP app link
Computer vision app link
Contacts page link
Login button
Without using Django, the homepage would just be index.html, the Statistics app would be a statistics.html page which interacts with the backend to show some plots, the NLP app would be an nlp.html page which interacts with the backend to display some NLP processed text and so on.
When using Django, how am I supposed to structure it? Should I create a separate NLP Django app, and a separate Statistics Django app and a separate Homepage Django app? I'm already surprised that I had to create an app just to be able to have a homepage, and then had to add path('', include('homepage.urls')), to urlpatterns to redirect / to the homepage app.
If I use the Bootstrap template for the homepage app, then how would I share the JS files, the CSS files and other boilerplate files of the template with the other apps of my website? Once the user logs in, would the session of the homepage app be valid for the other apps too?
Do I even need to create separate apps for NLP, Statistics, computer vision etc? What exactly is the purpose of Django apps, and could you mention a few use cases of Django apps and how boilerplate template files and scripts were shared among apps? Any best-practices related to app building?

How can I upload new webpages to a django app?

I am quite new to django so I am sorry if I have overlooked something simple.
This is my current website: https://www.michealnestor.com
I am trying to remake it using react and django, and a lot of it is different, however I want to keep the functionality of being able to run my js apps from the website: https://www.michealnestor.com/projects EXAMPLE: https://www.michealnestor.com/projects/sortingalgorithms/ .
I want to be able to upload project folders, with html, css and js in them from the admin page, and then be able to open these projects from my website. I am not sure how to do this though.
I have tried manually placing such a folder in a templates folder in my app, and I have managed to use a view to load the html file, but this file can't seem to find the css and js.
Maybe I am going about this the wrong way, in any case I would appreciate some guidance!

Django - how to render all pages of pdf files at once

I am trying to make a pdf viewer in HTML template using pdf.js in Django framework.
I had used a code that I got from a Youtube channel Traversy Media on how to create a custom PDF Viewer With JavaScript. It is working but I want to know if it's possible to render all pages at once.
Here's the link of the pdf.js full code in GitHub...
Is there an alternative way rather than sticking to this code?

Access static content of extjs production build in Django static path

I am facing problem with static content such as .png, .jpg files in Django+extjs environment.
I develop my client side in Extjs with sencha environment and test it locally with sencha server (sencha app watch) which works fine and I see the static images on the UI page.
Now I take a production build of that app (sencha app build classic).
It generates two folders.
Classic : This has app.js and CSS,fonts etc...
resources : (Here is the problem) This has static files like images and json files(if any)
Now I copy these two folders to my Django static path and access the app.js and and CSS files from Django's HTML template. This works.
However, The problem is Django is unable to locate the image files that are there in resources folder (mentioned in list item 2).
If the URL is 'localhost:81/app_name', it searches for the images in the below path
localhost:81/app_name/resources/images/abc.png
But is should look in the below path to get these files
localhost:81/static/resources/images/abc.png
What am i missing here? How Do I tell Django/Extjs to search for the static content in localhost:81/static/resources/images/abc.png
Please suggest.