You won't get hot/live reload, but you can use grunt to automatically rebuild and restart NodeBB when you make a change.
I run it with the
grunt command and looked in the
watch task to understand what files are synced. I understand the limitations of not getting a full browser sync and webpack-dev-server experience. However this are some problems I am facing:
Grunt watches at compiled code (mostly the
publicfolder). It is a nightmare to work in minified code, although obfuscation is not used. Even if you accomplish the task of change, you will need to go back and figure out where in the source to reflect the change. If you want to adhere to the DRY, SOLID principles, you would want to makes this changes into modules (plugins, widgets, child theme), which is a painful process at the moment. Just to make it clear, I am talking even about a small change like changing the color of a button, adding a span. Nothing even remotely advanced like I said above. Those were my target, but I wanted to start small, but I realize there is no easy way even to just learn by experimenting.
The docs is missing in my opinion a fundamental page that should be the very first thing a developer should find: Code organization. Here is some minimal information I could not find (although I could figure out some high level details, I will play the pure dumb card to make the point)
2.1. What goes where and why ? What is the difference between the
/srcfiles and the
/build/publicfiles. Why is the
/publicfolder not empty as it should normally hold only compiled code from the sources (the build process should be able to delete it and recreate it fully), are the
/public/lessstylesheets fundamental and that is where I make changes? What is server side code and what is client side code? From the docs, I understand that rendering can be done (and it is done) both on the server and on the client. It is a great feature, but a pain in the ass since now we are doing MVC throughout client and server. I can not simply grasp the complexity of changing a view or the choices of why a server rendering was used instead of a client one (or linking the counter parts together).
2.2 The docs are not compatible with an open source solution and look more like the docs I write at work for my team to just have a checkbox from my supervisor (nobody want to do it, but it has to be done just to say it was done). Please consider this as constructive criticism and do not consider this as rude comment for all the developers in the community or the confounders, for which I have a great amount of respect . It is simply frustrating that this amazing forum build is shooting itself in the leg with this. A simple example of this is the fact that I can not understand from the docs even a simple operation "Create
nodebb-theme-mytheme/templates". Where to create this folder? I am pretty sure it is not in the root of the project. Again this has the same problem "your theme's
/templatesdirectory, .... You may have to create this directory". Is it
build/public/templatesor all of my guesses are wrong.
With grunt you have to manually restart the build process as it is looking like I said before at compiled code. The docs says that you can be more efficient if you limit scope like
./nodebb build adminjs admincss tpl. But I did not find the definition of those scopes and I would be clueless on what scope to use. I could bet that they are less than 10 people that can use this feature optimally (not to mention it requires a lot of effort to plan, that just running the full build every time would save you time at the end). Again the problem also hints at 2.1, what files are covered by which build scope. What is the full list of build scopes and the architectural design choices behind them.
I don't think you want a widget here.
Widgets are reusable, customizable UI elements that you can place into specific areas in templates to add stuff to footers/headers/sidebars. These widgets areas are defined by the theme.
If you want to modify how an element of the forum looks but keep the same basic style of another theme (like Persona), then you probably want to create a child theme. This way you do not need to copy the whole Persona theme, though you certainly could do that instead.
I could have used the wrong term and widget was meant to comprise the plugin definition in the forum community. I would simply call them modules/packages in terms of programming culture. I understood that widgets are in this community referring to the Android vision of widgets that you glide on the screen in an anchor position, but still you would distribute them as
nodebb-plugin-... npm packages.
The fact that you can pinpoint it to a theme change or limit it to that speaks about the fact that there is something missing in the architecture design. It is not just me who has problem in recognizing the design patterns. I can tell you that it is not just a newbie problem. There is such a high barrier at the beginning that it is impossible to begin and most people will just give up. My interest was to use a forum and I was leaning towards NodeBB. I do not wish to become a Jedi master in NodeBB just to be able to change a button from left to right, as I feel it is the case at the moment.
I am still balancing in my head the options of building from scratch a forum in Angular and writing a backend (plain development of my use case and needs without even aiming for making it a public project) or spending the same amount of effort to understand and build the themes/plugins/widgets for NodeBB. I wanted option 2 as it would benefit an open source community of users, but I simply can not find the motivation to begin (or the means). For full disclosure, I am not building this forum for a business or in any way is this related to my work. This is why I am a bit careful on how I spend my time and I kind of inclined to go for option 1, as I will at least gain some valuable experience.
This is another customization to the theme, so not a widget.
This is a pretty big change from how NodeBB usually works, and it won't be easy to implement.
I guess if I want to use the NodeBB forum, I will have to go with already available plugins and just kind of profit from the work of other people. I would have wanted to contribute, but I can not see how I would be able to start to write any code for the forum.
I don't know the context of that, but you can use any IDE or editor capable of working with JS. What environment setup are you looking for?
I replied to this in a comment to @yariplus below