Researcher at Working on it
Needs advice
on
JavaScriptJavaScriptPythonPython
and
ReactReact

Hey everyone, I have a matrix chart drawn in HTML5/CSS 3 dominantly using CSS grid. I would like to add interactive features and am unsure about the best tool. My programming knowledge is limited to 2 semesters of Java in college, so I'd have to learn the language as I go. I am open to anything, but the selected languages would be useful in future projects.

Here are the features I am attempting to add to the site linked as my blog:

  • Assign over 120 attributes each to over 400 elements (probably in a DB)

  • Procedurally position elements in a matrix chart based on user-inputted filters (filtering and searching)

  • Procedurally position matrix elements based on attributes weighted by user-input

  • Change style of elements based on user input (highlighting)

  • Allow saving matrix chart states to be revisited or shared

  • Provide a user-friendly interface for users to submit the above input

  • Build several columns or matrices that are separate but related and seamless to the viewer

READ LESS
Security Certification Roadmap - Paul Jerimy Media (pauljerimy.com)
25 upvotes96.6K views
Replies (5)

PyCharm + Python + Flask + Jinja2 is enough to build web server/ajax and JavaScript + JQuery (maybe React). You can write small easy application but also extreme high scalable application.

I know Java but it need 4x time more code and code is not clear (too much forced use of @decorators) - too complex and takes more memory :)

Remember if you code in Python it is easy to code in Java but if you code in Java you must understand that Python is much more flexible and powerful - also easier to learn.

READ MORE
34 upvotes5 comments55.6K views
Paul Morgan
Paul Morgan
March 30th 2022 at 1:00AM

Thanks! Are you recommending PyCharm + Python + Flask + Jinja2 for the backend and JavaScript + JQuery for the frontend?

I was a little hesitant about Python for a app logic because my initial experience with Django was not great. I see Flask may be a better fit. Python is also a language I can apply to other projects better than Java.

Reply
Cezary Wagner
Cezary Wagner
March 30th 2022 at 9:23AM

Django is very old framework and little slow - if you want something modern faster try Jinja2. Django is not bad for ORM but Jinja2 is better for cloud or no SQL since more clear and faster - also more extensible with macros (Django is not bad still). If you know Django Jinja2 it is similar.

Reply
johnrivelt
johnrivelt
April 21st 2022 at 5:01AM

If you are goot at JAVA language, JHipster tool can generate pretty much all structures. Then, you can focus on backend logic and frontend implementation.

https://www.jhipster.tech/

If you choose Python,

Django is powerful framework but it have longer learning curve as it is big framework than Flask.

As Flask is microframework, very intuitive and easy to start, but you will need to configure manually some packages when your application grows.(e.g. flask-login for user features )

Yes, Pros and Cons

Python + Flask as backend is good option for you as @Cezary Wagner mentioned.

PyCharm is IDE tool, VS code can be alternative.

Jinja2 is popular template engine in python world. (https://en.wikipedia.org/wiki/Template_processor).

Not sure how big your data is for 120*400 matrix chart. According to data per page, this can be bottle neck of between your application and DB. Of course this will depend on how many users will access your app concurrently. Depends on your performance need, you might need to change some stack.

Reply
Masroor Ehsan
Masroor Ehsan
June 18th 2022 at 7:49AM

Aren't you comparing apples to "carts of apples"? Jinja is a templating library, while Django is a complete framework with its own ORM, routing, templating, config engine etc. Flask is a "microframework", it started out as an April fools joke, but caught traction pretty fast. Despite the appearance, Flask is not a "true microframework" though (it uses not-so-micro-sized libraries like werkzeug, jinja to do the actual heavy lifting... hence the joke) Flask was an answer to another quite popular microframework named "Bottle". Armin had wanted to add some features to Bottle, the maintainer refused, so he created "Flask".

I like Flask, but mostly for trivial, smallish projects. If you need more features then you're better off with Django and it's massive ecosystem. It's fun to roll your own solution for the first time, but it quickly gets boring. At the end of the day, developer productivity is the key.

Reply
Saadman Saif
Saadman Saif
April 11th 2022 at 10:16AM

Thanks! This was really helpful. 馃槃

Reply

There are two main facets to interactivity - whether your frontend (Javacsript, HTML, CSS) is programmed to behave dynamically based on events and on any other preprogrammed behavior, and based on what information your server can send and receive and compute for the benefit of your frontend. For the former (a dynamic frontend) you'll need to use Javascript (or Typescript) in some form. For the latter (a server with custom behavior and data endpoints beyond just sending static HTML etc. files), any of the major languages can serve this purpose. However, if you are going to create a dynamic frontend with Javascript and don't know that language at all, then learning it will be a task in itself, and without knowing a backend language well either (probably the case with only two semesters of one language a while back), you ideally don't want to also have to learn a whole other backend language on top of that. That's where NodeJS comes in. It has essentially the same exact syntax as frontend Javascript (just different native libraries). Since you already need to learn Javascript to make the frontend behave dynamically, if you also want a custom backend, NodeJS will spare you a big learning curve on top of the existing learning curve of learning JS. NodeJS is also highly performant for low-compute high-volume requests, i.e. handling a large barrage of requests if each doesn't require a lot of complicated behavior on the backend. A lot of coding bootcamps teach this, commonly called "full stack JS", for this reason - it allows someone to learn a constellation of full stack web development skills from the mastery of one language syntax. NodeJS + ExpressJS is also one of the easiest backend languages + REST API library to use to build a backend. Look up "NodeJS Express Hello World", and you'll be shocked at how easy it is to build a basic server. As far as frontend frameworks go, if this project is very limited in scope, JQuery could be fine, but I'd highly recommend learning React for something more involved - it will be immensely easier to manage and maintain, and generally lends itself to much better and more intuitive code organization. Its use of components will also be somewhat familiar and intuitive from the object oriented programming you learned through Java. Create React App is great tool to use, especially when first learning React, to avoid all of the finicky nonsense in configuring transpilation etc.

READ MORE
17 upvotes45.1K views
View all (5)
Avatar of Paul Morgan

Paul Morgan

Researcher at Working on it