rohanja / drag-drop-django

Create web pages using drag and drop method(django)

Dash Board For Creating Web Pages(Drag and drop) Using Django and Javascript

---

Dependencies

• Python 3.7.1
• Django 2.2.1
• Jquery and Ajax
• Html and css

---

Tasks Completed:

• Start create webpage and pick the html element from collection of element and drop in devepoling box.
• We can add more tags into the box.
• After complete design of webpage, You can preview that webapage.
• On clicking Save button that webpage would be store in database after taking input as name of web page.
• On click button(see created webapage) list would be open in blank tag.
• From that list of webpages, we can see that webpage and save.

---

Installation:

• To install using pip use below command :-
  ```pip install requirement.txt```

• Use pip or conda to install all above python-libraries
• Link css library and Link Jquery library
• Access on localhost:8000/

---

Describe Module and Functions:

myapp/views.py

• Home()
  • url: localhost:8000/
  • This funtion will render 'home.html'.
• send_html_element_from_python_function()
  • url: localhost:8000/request/Element/
  • This function would call through above url and response data after retieve from database.
• request_element()
  • url: localhost:8000/request/element/
  • On click button(add more element) for add specific tag then jquery and ajax function request data from above url and then above function give response. In this function, a variable is declared as string value. I used that variable directly.
• save_file()
  • url: localhost:8000/savefile//
  • On click Save button then page code is read with javascript and send to above function through above url and then code would be save in database.
• Show_pages()
  • url: localhost:8000/show_pages/
  • On click button(show created pages), this function would retrive all data and show data file names with render 'show_pages.html' template.
• Open_pages()
  • url: localhost:8000/Open_page/
  • If we want open any webpage, then click button present in list then above function retrieve data from database and send data through above url.

myapp/models.py

• Document()
  • This django model is used to store Html tag file.
• create_page()
  • This django model is used to save created page.

static/home.js

• This static file is used by 'home.html'. Ajax and Jquery code is present in the same file and other javascript event is also present in this file.

I used dynamic templates with extending html base file.

---

Instructions

• Run with 'python manage.py runserver'
• Make sure network connection(Jquery and css bootstrap library's online link are used. )