What is clementine.js for?

I just finished the FCC Apis Projects and finished the Get Set for our Dynamic Web Application Projects step with just clicking through, because i don’t get the point of clementine.js. What is it doing actually and how does it help me completing the Backend Projects?

It is a starting point for your future projects. It uses MongoDB, Express and Node.js, which might be hard to integrate starting from scratch. Just use this example to get a general idea of how those apps work and then remove and change stuff for your purposes.

What it does if I remember correctly: You can log in with Github and save to a database how often this particular Github user clicked the button. That’s it.

Ok, but it would take like 5 Minutes to set up this three things on heroku for a normal Project. I just don’t get the point of this.

You don’t need the whole example for every project. Don’t get irritated. It is a just a starting point and boilerplate code, which means that usually need to include most of the stuff anyway. Takes some time to setup a miimal working project in any case.

1 Like

Ok i will try it maybe it will turn out usefull, but thanks for your response. Did you work with clementine.js ?

I copied the project structure and changed/deleted everything I did not need. I did not use Mongoose, though. Not sure why.

Not every template project is the right fit for each user. There is a clementine tutorial that shows you how to build a small full stack app. Since don’t it, like you inprefer to build my own. Don’t use it if it’s not helpful for you.

1 Like

Yeah, I just got there myself. I finished the microservice builds and said to myself, OK, you’re getting the hang of this. You can do this.

And then WAMMO! They hit me with that crap. Passport, express-session, mongoose, etc. Now there’s this complicated split up file system that is alien to me. (All of the projects I’ve done so far have been in one JS file.).

It was like getting hit in the head with a 400 pound tuna.

I think I’ll go through clementine’s tutorials. I’ll get there, but every time I get some momentum here, fCC takes a quantum leap in the technology without warning and without any teaching materials.

Anyway, I’m about to go on vacation. Any books to help prepare me specifically for the issues I will run into on these back end challenges?

Dont use books as a crutch. Just wing it by googling and asking questions. :smile:

Joining this conversation late. It was really helpful. I was going through the Dynamic Web App setup with c9.io and clementine.js and the out of the box clementinejs gives an error and the node server won’t start. I’ve spent a good amount of time trying to troubleshoot, but I think it’s a sign to try to do these apps with a heroku. I’d like to turn learn that anyways.

Since this opened up again, I will say that I found the book Express in Action to be useful. I wish I’d read that before I did the backend stuff.

1 Like

Thanks for the reco @ksjazzguitar

Did you ever tackle the Clementine? I am still struggling with it. Trying to work through the official tutorial, getting stuck, and finding zero documentation out there to tell me why.

I worked with it for a while, but it was too much for me. Now it would make a lot more sense. I think I used some of the clementine for a basic structure, but had to work through a lot of youtube videos to get a grasp on how the file structure and routes worked. I especially needed help getting passport to work. I just struggled and struggled and eventually it started to click. But it wasn’t easy. Now it all makes sense.

Cool. Did you ever run into the problem where _id is NOT getting excluded from your findOne results despite the fact that you created a projection for _id?

I am working through the official Clemetine tutorial at the moment and I have been stuck on this literally for days.

     function clickHandler (db) {

    var clicks = db.collection('clicks');

    this.getClicks = function (req, res) { 

	var clickProjection = { '_id': false }; // we don't want the default _id value included in the results

	clicks.findOne({}, clickProjection, function (err, result)

etc

Any insights you could provide would be appreciated.

OK, I’m certainly no pro here, but …

Setting it up and running it, I see that you aren’t getting the number of clicks. I see that it is not being created in the database and I got the following error in my browser console:

clickController.client.js:45 GET https://localhost:8080/api/clicks net::ERR_SSL_PROTOCOL_ERROR

AFAIK, https is difficult to use on localhost. When I go to your file app/controllers/clickController.client.js on line 16 and change it to http, now the database is created and the client is receiving a value of clicks. The buttons don’t work yet, but I’m assuming that you haven’t created those routes in the tutorial yet.

So I think that gets you working. It’s amazing how much damage one letter can do.

1 Like

I cannot thank you enough for taking the time to respond to my question.

Your reply sent me down the correct path (finally!).

Indeed, one of the mistakes I was making was a mixed request - there was a mix of http and https stuff in my code.

Since I am running this on c9 there is kind of no way I could discern to get around using https. So a big part of the answer was actually to make sure everything was https. I was a little concerned because even though I converted everything over to https I am still using var xmlhttps = new XMLHttpRequest(); Apparently, from what I have read, that is not a problem.

ALSO, I forgot, the official Clementine tutorial was written assuming the student was using local host. I am using c9. So this change was also necessary:

//var apiUrl = 'https://localhost:8080/api/clicks';
var apiUrl = 'https://clementinetutorial1-olddognewtrix123.c9users.io/api/clicks';

NOW, I am getting “You have clicked the button 0 times.” and no connection errors, instead of “You have clicked the button times” plus a bewildering error in the console.

Thanks again!

hello people from the future - i think clementineJS is quite out of date so im thinking about putting together an updated version - please head over to FCC Backend People: Give me thoughts on my Node+Express+MongoDB+React tutorial (a modern update to ClementineJS) for more discussion

Clementine.js is an open-source boilerplate for full stack JavaScript development originally created by Blake Johnston in 2015. There are many other JavaScript boilerplates, but often they are very large and complex. As a novice programmer, these are sometimes difficult to untangle and while learning how to code.

The primary reason Clementine.js was created was to provide a small and simple option as an alternative to these other boilerplates. This offers an option for beginners to see how pieces fit together in a simple manner, and provides a simpler starting point for other developers. The default (standard) version of the Clementine.js boilerplate comes in at around 4.1 MB with all dependencies installed (excluding database size).

Another advantage of the project is that it is designed without any bias toward a front-end framework or other tools. With the rapidly changing landscape that is JavaScript frameworks and libraries, it’s difficult to keep pace with the latest trends. In the case of Clementine.js, that decision is left up to the developer.

Clementine.js is built using Node.js, MongoDB and Express.

Adrian Gates
Sr. Front End Developer - Apps4Rent