Full universal boilerplate for react redux - react-redux

I didn't find any good boilerplate, as I want. I need boilerplate with:
React
Redux
Express
Routering
Server-side rendering
Thunk middleware
Hot reload
Css-modules
Webpack
Babel
Eslint
Dev and Prod mods
I didn't find anything in all github! Making it yourself is very very complicated - many errors, stupid things! I spent 2 monthes for this and didn't achieve the desired result.

I strongly recommend working through this: https://github.com/verekia/js-stack-from-scratch
Aside from the fact that it covers everything you asked for an more, this repository actually walks you through the setup of your own 'boilerplate' which is a far more valuable tool in the long run.
I have a simple boilerplate repo that I built up based on that repo here: https://github.com/savish/sample-js-app

Related

Is there a point using Vuetify or should I just be using TailwindCSS or another library?

I stumbled on a web app project that was using ElementUI and spent most of the year updating dependencies. Ended up installing PostCSS and rebuilding the admin Panel how I wanted it to look and feel. It way recently decided to install Vuetify as the UI components are more modern looking and they use tailwind.
Whilst it has given some dated UI components a better feel. I still find myself reskinning and re theming. In some cases building my own transitions or adding new effects.
I hate using apps that have a repetitive UI.
My question is is there any point using Vuetify as at times I find myself battling with their "skin" and using a ton of CSS !important - which doesn't seem like good practice.
Sometimes I see UI or /UX design, and I think it looks cool, but I don't always want the whole thing. I'm the only one on the team that has been fond of tackling the CSS.

Setting up vuejs and laravel

I'm fairly new to Vue and only learn a little bit of it. Actually it's my first time seeing this beautiful library (whatever you may call it ) And i saw many developers actually pulling many dependencies from npm like vueify, and many more. Now, I just want to ask. I'm only a beginner. and what i know is to just pull of my files and store them in my resources/assets/js folder and just do elixir on them. And, is it really a good practice to just pull of those dependencies and browserify/webpack on them regardless the size of the app i'm developing ? Humbly asking for opinions

standard d3 workflow and hosting solutions

I am new to d3.js and it seems like there are a lot of options when it comes to developing and hosting projects.
Options include:
bl.ocks.org
plnkr.co
jsfiddle
jsbin
vida.io
etc.
I can also run a web server with python for local development, but in my case, I am not able to host my projects locally.
bl.ocks.org is really popular, but I have run into many caching issues when using it to develop code (make a change, wait 5 mins, see the change).
At the moment, I was thinking that the best bet would be to develop locally then put the code in a gist and use bl.ocks.org to host it.
My question is:
Is this a fairly standard and sensible workflow for d3 and are there any other services out there that you recommend I should use instead of bl.ocks.org?
Develop locally. For most D3 work you don't even need a server running, since browsers will "serve" static html, javascript, json and csv over the file:// protocol (EDIT: except Chrome). This makes the development cycle simple, fast and easy.
Deploy with GitHub. If you're just serving static pages and not hosting anything else, it's the fastest way to get something up on the web. There are two good ways to do this:
Gist hosted, view on bl.ocks.org. This is great for little examples and one-off tricks. The best part of this is that it just works, no configuration necessary. Also it's neat to see the auto-generated gallery of your visualizations.
GitHub Pages. This is best for more significant projects, since you can completely customize the interface to your liking (and even use your own domain!). Just don't forget to put a "fork me" ribbon in the corner.
And please do post any neat visualizations you build to the gallery!

Build an app with marionettejs with requirejs?

I have used backbone boilerplate on the past
https://github.com/backbone-boilerplate/backbone-boilerplate
I want to use marionette on my next project and I have found this
https://github.com/BoilerplateMVC/Marionette-Require-Boilerplate
My question is if it's a good idea to go with the marionette boilerplate or start form scratch.
As an aside, I'd like to suggest you give Yeoman a shot for scaffolding your first Marionette app. Yeoman works via what are called "generators", and provide much more than the the above Boilerplate MVC can offer you (Chai and Sinon for testing, Bower for client-side package management, etc...). Plus, Addy Osmani, who runs backbone-boilerplates is one of the heads of the project. Check out generator-marionette here.
I haven't used BoilerPlate, but glancing through it, it certainly seems like a valid approach to writing Marionette apps. If you're just getting started it will certainly help you see how the various pieces are supposed to be used. One gripe I've got is the folder structure. I prefer to break my applications down into modules, and then add models, collections, views, etc under each module. But this will certainly get you up and running quick, and there's nothing stopping you from customizing it to suit your needs.
I agree with others here: it is a useless limitation to imitate a folder structure that follows the 'old mvc model for server-side code'. You will remain more flexible further down the road if you think of your application strictly as completely self-containing modules, i.e. they contain their own controller/router/views/collections/templates etc. You can have a separate folder structure for shared code that is not a module, although anything can be made a module :)
Regarding boilerplate code and generators: i think in the beginning you should actually NOT do it, because you won't understand what you're doing. But that's just my personal opinion.

Express.js' router and controllers' usage

I mainly worked with Rails-like frameworks in the past. Recently, I've been looking into Express.js. I've noticed that most of the examples do the routing inside the main app.js, or do the rendering inside route.js and I'm a bit uncomfortable with that.
A slightly more familiar example is the mvc folder in Express.js' github page, but even then, I find the way the routing is done a bit weird (also, view folder inside controllers? What's happening?).
My question is, what change of mentality should I perform, or is there a standard way of using Express.js that clearly separates the concern of routing and controllers and make them work neatly?
Thanks.
After a bit more of experimentation, I answered my own question.
Express is not made for these kind of tasks. Frameworks like Geddy or Tower are, although none of them are production-ready like Express is.
There is a module called Express-resource that does just what I want. Nevertheless, in the worst case, it's relatively easy to build one's own routing / controlling mechanism in Express.

Resources