Looking for step-by-step instructions on how to get started

Getting Started
1

Hi,

While typing this I realized that I’m mostly looking for general js-advice but also specific rs-advice, please let me know if this is completely out of line for this forum and feel free to direct me to a more suitable place.

So, I’ve known about rs for a long time but I’ve never actually had a reason to understand how to use it (and javascript in general). I’ve done some web-development back in 1999-2001 but decided the field wasn’t for me.

Now I’ve slowly started to enter again to do some hobbyist stuff, this would be my second project (the first was to set up and maintain a wiki).

What I’m looking to accomplish is to create a small collection of unhosted apps to store and evaluate progress for my mediocre at best League of Legends experience. (I want them unhosted to both learn how to use rs, etc but also to be able to share my work without eating my small webhosts quotas.

For a slightly tl;dr of what I want help with see below, now follows a ‘brief’ explanation of what I want to accomplish…

The purpose of the first app is to record my deaths and to evaluate what I could change to die less, it should work something like:

  • you create a profile (to store an api-key for the Riot-api and possibly some other stuff)
  • you want to store data about your next game, so you click ‘add game’
  • you enter data on your pre-game condition and things you want to consider in the next game_
  • after the game is over you click on ‘get game data’ and the the app prefills some values (with the help of the api):
    • date of game
    • kind of game
    • what champions where in the game
    • your kda and team kda
  • you get some fields to enter your assessment of why you died (each time) and what you could have done instead in that situation (you are expected to watch the replay while doing this)
  • there should be a report view with multiple reports (things like avg numbers of death over time, avg time of first death over time, correlation with win/loss of the game, etc, etc)

So, what I want to get help with is:

  • an extremely simple example of how to use rs in an app and connecting it with a rs-server (I really don’t want to set-up my own server) or other available backend (if they exist). And some pointers on where to go next.
  • suggestion for a stable, well documented and simple open source js-library to interact with a remote api
  • suggestion for a stable, well documented and simple open source js-library to deal with UI
  • pointers on how to tie it all together

I tried to look at the documentation here but frankly it is too high-level for me, like I should already know how things work but needing details on some specific issue.

I hope you will be able to help me or at least point me in the right direction.

2

Ok, I actually found the docs now, not sure how I missed them before, but I’ll get reading on those and get back for help when I need it. (hm, on a second look, I didn’t find a link to them on the front page, I found them through a post on the forums.)

I would still appreciate help with the other points I listed above.

3

Glad you found the docs!

It seems like we have to improve the website to better explain that remoteStorage itself is the protocol, while remoteStorage.js (which is what you found the docs for) is the official reference client library. Anyone is free to implement both clients and servers any way they see fit, in any language, on any platform, etc… In fact, you don’t need a library at all, if you implement the functionality in custom code. remoteStorage.js just makes it a lot easier, down to the point that you don’t have to think about the protocol even.

Now, regarding the still-open questions: one simple example for how to use rs.js in an app would be the offical demo app My Favorite Drinks.

But as to the other questions, that’s really a lot to ask, because essentially you want someone to post the curriculum for an introduction class to modern JS app development. I’ll try to point you in the right direction anyway, but please keep in mind that a single comment on a forum is hardly enough to get pointers for what people take years, even decades, to learn.

You don’t actually need a library for that, as APIs on the Web are just HTTP calls. The modern way for doing that would be the Fetch API. However, in order to connect to an API from an unhosted JavaScript app, it either has to support CORS, or you will need to use a proxy server that you connect to, which adds CORS headers to your Fetch requests. (At my company, we offer that as a free add-on service to people hosting their JS apps with us.)

This is exceptionally difficult to answer, because there are so many different options, and they also differ so wildly in their concepts. One popular option would be Facebook’s React for example. But that just gives you the view layer, and nothing else. I personally am a big fan of having a framework that does everything else for me as well, so I’m using Ember.js. Then again, others swear on the simplicity and approachability of Vue.js.

But these frameworks only give you the tools to build the behavior of your app, and not the visual elements. That’s a whole different problem category with equally diverse and plentiful solutions. I guess Bootstrap is still a popular choice, but that’s just one option out of at least 10 good ones.

Again, exceptionally difficult to answer, because that differs based on all the choices you made with the other options. However, I did recently stumble upon a fantastic article that teaches you the essential basics for modern JS development, when it comes to tying things together and building/transpiling/minifying/etc. your code: https://medium.com/@peterxjang/modern-javascript-explained-for-dinosaurs-f695e9747b70

Last but not least, it’s still an option to not use ANY framework for implementing your app, and just do it all in plain HTML, CSS and JavaScript. That’s actually what My Favorite Drinks does. It all depends on how much you really want to learn about frameworks and JS app development, and how much of your time you really want to spend on it. All options are equally valid and reasonable for that matter in my opinion.

4

Thanks for your great reply, although so little of it has to do with remotestorage itself :slight_smile:

I actually now this, but I think the distinction is not relevant for people like me, for all practical reasons rs.js is what I’m here for: I just want to use rs in an app, not develop the spec or make my own implementation.

Ok, this is fantastic information, that would have taken me months to figure out :slight_smile:

Thank you, again, this is an excellent resource!

Good point, I think I would like to learn the real deal down the road, but at the moment I mostly want to churn out a somewhat working prototype… we’ll see how that works out :slight_smile: