7 ms·

What do you use to write your front end Javascript?

anchpop 8y ago
Django fan here, if you're trying to use Django with react you may be interested in this: https://github.com/anchpop/cookiecutter-django https://github.com/anchpop/cookiecutter-django I wrote it for my own convenience but others may find it useful.
deleted 8y ago
[deleted]
johnthedebs 8y ago
Not OP, but I've also been using Django for (more than) my whole career and I use React on the frontend. If you're curious about the frontend path I took, it was roughly: * jQuery with no framework * Backbone (for a couple years) * Backbone + Marionette (for a couple more years) * Angular (for about a week) * React (for the past few years)
- blackrock 8y ago
  Thanks for the input. Comments like these are insightful. What do you think of Vue.js?
  - ergo14 8y ago
    Vue looks nice, but nowdays I'd pick something like lit-element(lit-html) or stencil.
    - deleted 8y ago
      [deleted]
  - duiker101 8y ago
    I have spent some time using Vue.js and Django as a backend and I have been pretty satisfied with the results! I will probably try React next just to make sure I am not missing anything. I tried using node as a backend but I couldn't find any framework on the level of Django so I went back to it. There are some pretty decent boilerplates already to setup a Django/Vue website if you look for them.
  - kennydude 8y ago
    Vue is a pleasure to build stuff in. It just seems to work well, especially with nice things like two-way binding out of the box.
  - johnthedebs 8y ago
    I've heard great things about Vue.js (mostly on HN) but I haven't tried it myself. I'm pretty invested in React (I use it at work and for personal projects), and I find it to be a pleasure to use so I'm not actively seeking out alternatives. State management with React is another story; I've used Reflux and Redux a lot, and am experimenting with Mobx now.
- oneweekwonder 8y ago
  When you moved to Angular and later to React did you have any jQuery heavy libraries? I'm using stuff like slickgrid[0], jquery-ui datepicker, json-editor[1] and wonder how I will drive these components from something like Angular or React? doh, quickly googled for the github links below and saw there now a slickgrid-es6[2] fork which I have not tried. But my question still stand: how do you drive jquery libs from newer frameworks? [0]: https://github.com/6pac/SlickGrid/wiki https://github.com/6pac/SlickGrid/wiki [1]: https://github.com/json-editor/json-editor https://github.com/json-editor/json-editor [2]: https://github.com/DimitarChristoff/slickgrid-es6 https://github.com/DimitarChristoff/slickgrid-es6
  - conradfr 8y ago
    I have encapsulated jQuery (including Bootstrap) plugins in AngularJS, React and Vue in the past. They all allow you to access a DOM node somehow. Maybe it's frowned upon but I don't really like to use those (usually partial) Bootstrap re-implementation, especially in non-SPAs where you already have jQuery and/or Bootstrap. Of course it's becoming less and less necessary.
  - always_good 8y ago
    You can access the raw DOM node from a React component. On component mount/unmount, you can apply a jQuery library to the DOM node and optionally clean it up. It's the same way you can wrap a <canvas> node with a React component and otherwise do all your draws outside of React (like for a game). This way the node is still integrated into your React app but React does nothing more than create/remove it.
  - johnthedebs 8y ago
    Other users have already commented, but basically you can wrap jQuery libraries in React components and do a bit of extra work in the lifecycle methods (componentDidMount, componentWillUnmount, etc.) to manage the jQuery bits. Once you've wrapped it in a component, you can more or less drop that component anywhere in your view hierarchy and not have to think about the fact that it's using jQuery under the hood. This highlights one of my favorite things about React and similar frameworks, which is that it's the closest thing to actual, useful encapsulation of components I've seen in a frontend framework. It's not perfect, but it's much better than everything I used before it.
- mrfusion 8y ago
  I’m curious what makes react your top pick?
  - johnthedebs 8y ago
    Compared with Backbone, I was able to compose and re-compose component structures much more easily. Compared to Angular (which I admittedly don't really know) the API learning curve felt very short and I was able to wrap my head around it very quickly and be productive without constantly looking things up.
Franciscouzo 8y ago
Not OP either, but I've been using Django REST framework with React.js, and I'm really enjoying it.
- knicholes 8y ago
  Any tips for how to use JWT authentication and get around CSRF tokens being in forms when combining DRF with a JS SPA UI?
  - kennydude 8y ago
    The way I've always done it is to not log the user in to a Django session. That way the SPA is the thing which holds the authentication, be it JWT or any other kind of token. If any other site tries to POST to the API on behalf of the current user they'll get a "Authentication credentials required" message.
  - theptip 8y ago
    If you want JWT, you can use https://github.com/GetBlimp/django-rest-framework-jwt https://github.com/GetBlimp/django-rest-framework-jwt -- that provides another authentication class, and you can then auth with `Accept: Bearer <jwt>`. If you don't need JWT (I'd probably leave it out next time round) then Django Rest Framework comes with a simpler bearer token auth class (among others): http://www.django-rest-framework.org/api-guide/authentication/#tokenauthentication http://www.django-rest-framework.org/api-guide/authenticatio.... edit to add - if you're asking specifically about sharing sessions between the JS app and the Django server-side form, I believe this is what you're looking for:http://www.django-rest-framework.org/api-guide/authentication/#sessionauthentication http://www.django-rest-framework.org/api-guide/authenticatio..., i.e. you'll still need to pass the csrf token into the JS app.

Django fan here, if you're trying to use Django with react you may be interested in this: https://github.com/anchpop/cookiecutter-django https://github.com/anchpop/cookiecutter-django I wrote it for my own convenience but others may find it useful.

deleted 8y ago

[deleted]

johnthedebs 8y ago

Not OP, but I've also been using Django for (more than) my whole career and I use React on the frontend. If you're curious about the frontend path I took, it was roughly: * jQuery with no framework * Backbone (for a couple years) * Backbone + Marionette (for a couple more years) * Angular (for about a week) * React (for the past few years)

blackrock 8y ago
Thanks for the input. Comments like these are insightful. What do you think of Vue.js?
- ergo14 8y ago
  Vue looks nice, but nowdays I'd pick something like lit-element(lit-html) or stencil.
  - deleted 8y ago
    [deleted]
- duiker101 8y ago
  I have spent some time using Vue.js and Django as a backend and I have been pretty satisfied with the results! I will probably try React next just to make sure I am not missing anything. I tried using node as a backend but I couldn't find any framework on the level of Django so I went back to it. There are some pretty decent boilerplates already to setup a Django/Vue website if you look for them.
- kennydude 8y ago
  Vue is a pleasure to build stuff in. It just seems to work well, especially with nice things like two-way binding out of the box.
- johnthedebs 8y ago
  I've heard great things about Vue.js (mostly on HN) but I haven't tried it myself. I'm pretty invested in React (I use it at work and for personal projects), and I find it to be a pleasure to use so I'm not actively seeking out alternatives. State management with React is another story; I've used Reflux and Redux a lot, and am experimenting with Mobx now.
oneweekwonder 8y ago
When you moved to Angular and later to React did you have any jQuery heavy libraries? I'm using stuff like slickgrid[0], jquery-ui datepicker, json-editor[1] and wonder how I will drive these components from something like Angular or React? doh, quickly googled for the github links below and saw there now a slickgrid-es6[2] fork which I have not tried. But my question still stand: how do you drive jquery libs from newer frameworks? [0]: https://github.com/6pac/SlickGrid/wiki https://github.com/6pac/SlickGrid/wiki [1]: https://github.com/json-editor/json-editor https://github.com/json-editor/json-editor [2]: https://github.com/DimitarChristoff/slickgrid-es6 https://github.com/DimitarChristoff/slickgrid-es6
- conradfr 8y ago
  I have encapsulated jQuery (including Bootstrap) plugins in AngularJS, React and Vue in the past. They all allow you to access a DOM node somehow. Maybe it's frowned upon but I don't really like to use those (usually partial) Bootstrap re-implementation, especially in non-SPAs where you already have jQuery and/or Bootstrap. Of course it's becoming less and less necessary.
- always_good 8y ago
  You can access the raw DOM node from a React component. On component mount/unmount, you can apply a jQuery library to the DOM node and optionally clean it up. It's the same way you can wrap a <canvas> node with a React component and otherwise do all your draws outside of React (like for a game). This way the node is still integrated into your React app but React does nothing more than create/remove it.
- johnthedebs 8y ago
  Other users have already commented, but basically you can wrap jQuery libraries in React components and do a bit of extra work in the lifecycle methods (componentDidMount, componentWillUnmount, etc.) to manage the jQuery bits. Once you've wrapped it in a component, you can more or less drop that component anywhere in your view hierarchy and not have to think about the fact that it's using jQuery under the hood. This highlights one of my favorite things about React and similar frameworks, which is that it's the closest thing to actual, useful encapsulation of components I've seen in a frontend framework. It's not perfect, but it's much better than everything I used before it.
mrfusion 8y ago
I’m curious what makes react your top pick?
- johnthedebs 8y ago
  Compared with Backbone, I was able to compose and re-compose component structures much more easily. Compared to Angular (which I admittedly don't really know) the API learning curve felt very short and I was able to wrap my head around it very quickly and be productive without constantly looking things up.

Franciscouzo 8y ago

Not OP either, but I've been using Django REST framework with React.js, and I'm really enjoying it.

knicholes 8y ago
Any tips for how to use JWT authentication and get around CSRF tokens being in forms when combining DRF with a JS SPA UI?
- kennydude 8y ago
  The way I've always done it is to not log the user in to a Django session. That way the SPA is the thing which holds the authentication, be it JWT or any other kind of token. If any other site tries to POST to the API on behalf of the current user they'll get a "Authentication credentials required" message.
- theptip 8y ago
  If you want JWT, you can use https://github.com/GetBlimp/django-rest-framework-jwt https://github.com/GetBlimp/django-rest-framework-jwt -- that provides another authentication class, and you can then auth with `Accept: Bearer <jwt>`. If you don't need JWT (I'd probably leave it out next time round) then Django Rest Framework comes with a simpler bearer token auth class (among others): http://www.django-rest-framework.org/api-guide/authentication/#tokenauthentication http://www.django-rest-framework.org/api-guide/authenticatio.... edit to add - if you're asking specifically about sharing sessions between the JS app and the Django server-side form, I believe this is what you're looking for:http://www.django-rest-framework.org/api-guide/authentication/#sessionauthentication http://www.django-rest-framework.org/api-guide/authenticatio..., i.e. you'll still need to pass the csrf token into the JS app.