Intro and general question

You can evaluate reactstrap for a react bootstrap 4 library.

Bootstrap 4 has been around for a long time now and it is the way forward.

All in all, you’ll find both react and vue make it easy to get any vanilla bootstrap markup and styles and create components out o them.

Therefore, I’d suggest not to delve too much into the details. If you find that any react/vue bootstrap-4 library is actively maintained, you’ll likely to have very few problems with it. Even if the component coverage is not 100%, it should be easy for you to cover it yourself.

Nonetheless, you should also evaluate from a requirements perspective. Lots of projects just require a handful of the components actually :slight_smile:

And keep in mind:

:wink:

1 Like

@serkandurusoy, I saw that reactstrap is using v4, but as react-bootstrap is getting around 5x the monthly NPM downloads, I can’t help but wonder whether the community size should also play into this decision.

That said, there’s still 2x more downloads of reactstrap per month vs bootstrap-vue. So, maybe that’s the middle ground I should be seeking :smile:

I agree completely with your comment about decisions being requirements driven. Problem is that while I do have a smaller set of day-one requirements, I have larger long-term hopes for this project and want to do what I can now to increase my chances of it being the right longer-term choice.

Thank you for your encouragement and reminder to avoid further analysis paralysis also :wink:

1 Like

@greenmoose, it does seem that we share some common requirements. Thanks for your input. My project is also evolving out of a motley set of homegrown tools, predominately Excel-based. I evaluated Zoho but quickly hit some issues with more advanced logic and database queries. I use Zapier to interface some industry-specific apps with third-party API’s, which has actually been very successful, but won’t scale to my longer-term requirements. No existing systems can do what I want without me paying high fees for features I don’t need, and then still adding other vendor solutions on top. So, I’m taking the route of building one, first for internal use, but with an aim of turning it into a commercial venture. Necessity is the mother of invention, as they say. Hence, all the careful due diligence (and a touch of analysis paralysis!).

You are correct, I am indeed a powder hound! Lived in CO for 12 years, and skied the Rockies almost weekly. I just moved to France, 45 mins from ski resorts in the Pyrenees, but am unfortunately on the bench this season due to an injury :frowning_face: Shame, because it’s been dumping in Europe all season! So, with no powder to distract me, it was time to take the plunge and start coding…

@paulishca, thanks for mentioning Redux. Although I’ve never used a state management system, I have identified this as important as my project grows. I saw that in the Vue docs, they talk about Vuex being available for this purpose.

I’ve used neither, so can’t make any judgements, except to say that this seems yet another area where Vue and React have similar advantages. Good to hear about your positive experience with Redux, though. It’s definitely on my radar for the future.

@turbob, all good points, thanks. Good to hear that your switch to Vue is going well.

I spent a lot of time doing some further due diligence this weekend and have reached a decision on this. I’m going with React. Here’s why.

Building a native app is important in my longer-term strategy for my project, but I want to stick to full-stack JS. So, I did some more research into React Native and Weex. I found a recent blog post comparing the two:

which was a good summary of what I’ve read elsewhere and confirms my suspicions that Weex would just be too difficult to get going in the near future. It seems that if I want to stick to JS (with some flexibility to add some native code if necessary - though it probably won’t be for me), then React Native is the way to go.

This was a sad finding. I’d spent much of Saturday reading the Vue docs and really liking the approach, especially that I had the freedom to use JSX if I needed to. Also, the main library that supports Bootstrap (vue-bootstrap) supports Bootstrap 4, which is a big plus. If Weex was as mature and easy to use as React Native, then I’d use Vue. But, it isn’t currently, and I need to be lead by my project’s requirements so that was the deciding factor.

I’ve decided to use react-bootsrap to support Bootstrap in React (which supports Bootstrap v3), rather than reactstrap (which supports v4). I’ve concluded that the former is more stable and will give me less brain-ache, when I’ve already got a steep learning curve. At this stage, this is more important than the benefits that I’ll see with Bootstrap v4 support. They are working on it, and now that v4 is out of beta, I think that work will get more attention. By the time I really need v4, it’ll probably be supported.

Now my next question is whether to jump right in to writing my own components or to use a template such as this: https://www.creative-tim.com/product/light-bootstrap-dashboard-pro-react

Thanks to everyone for your suggestions and support on this question. I hope that others have found the exercise useful! :grinning:

2 Likes

Nice summary and it is great that you’re sharing here your journey as you go along.

Regarding creative tim, I’ve used their products in the past and they’re actually quite good. Their react versions are also similarly good, but the pro versions may include jquery for some of the components which means dom manipulations, which is discouraged in react-land. Furthermore, I find these dashboard templates to be including too much code and opinion, such that it might make more sense to start off from a clean codebase.

Nonetheless, you can purchase it, or get the free version, use it as a general basis to your overall layout and perhaps copy over some of its components.

So yeah, it will definitely help you but instead of building your on top of that, build your app from scratch, copying over parts of that template as you see fit.

1 Like

Thanks again, @serkandurusoy. Good to hear some feedback on Creative Tim. I understand your point on jquery, and will aim to avoid it. This is why I will not be using Bootstrap directly, but rather react-bootstrap. I had assumed that because this template uses react-bootstrap, it too avoids jquery. I’ll validate that before proceeding.

I agree that rigorous adherence to a template could be a step to far. There’s a balance to be struck between code reuse and developing your own code. A compromise seems the best approach, and using the free template as a learning tool could be a good start. If it seems worth it to invest in the pro version and use some of their components then I’ll do just that. It could speed up development of the MVP, but I have no doubt that as time goes on, I’d be developing more custom components.

1 Like

With regard to jQuery in that Creative Tim template I referenced, in case anyone else is interested, I received the following response from the authors:

The only component that uses jQuery is the DataTable and this is because we didn’t find a react library or a react component that could do what DataTables.net does. Manu.

1 Like