couchdb-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Dulanga Sashika <wadsash...@gmail.com>
Subject Re: [COUCHDB-2214] Dashboard as main page
Date Tue, 17 Mar 2015 12:52:01 GMT
Hi Robert,

Here is the current status of the checklist :)

 - check out the active tasks api (linked on top of this mail) - (finished)
 - a mockup showing some widgets and how they could look like - (started
but not finished yet)
 - code React tutorial & read about Flux - (finished)
 - take a look how we are using React - (finished)
 - create another menu item, called "Dashboard", try to answer the
questions to route.js et al - (started but not finished yet)
 - get familiar how we test our code - (finished)
 - write an hello world / hello from dulanga component that is
rendered into a screen when opening http://localhost:8000/dash or by
clicking on "dashboard" in the sidebar - (started but not finished yet)

I will do my best to complete all these by tomorrow. If I have any problem,
I will trouble you as you wished yesterday :)

Thank You

On Mon, Mar 16, 2015 at 3:15 AM, Robert Kowalski <rok@kowalski.gd> wrote:

> Hi Dulanga,
>
> we already talked on irc and you already talked to Alex regarding
> features for our dashboard. That's great!
>
> Some topics will repeat in this mail, but I also would like the ML to
> follow our project and additionally add some more in-depth
> informations.
>
> Recap & additons
> =====
>
> As discussed we will work in an iterative approach and add widget
> after widget so if we run out of time, we will have something to
> deliver and don't have to throw everything away.
>
> Have you seen the "database" tab or the "config" tab in the sidebar on the
> left?
>
> Those are modules that we can hook into the Fauxton build, by
> configuration. I think the idea is to create a tab "dashboard" which
> is the default one after opening Fauxton in the browser. So you would
> build the dashboard for Fauxton as part of Fauxton.
>
> Alex ideas so far:
>
> ```
> 17:34:13 <+Kxepal> about from what to start...in issue there are some
> points about showing stats and log - forget these (: _stats isn't
> available for
>                    cluster iface and _log is removed. but recently
> visited databases, active tasks and _users/_replicator quick
> management is what could
>                    be really handy.
> 17:34:56 <+Kxepal> link to the user profile is also not relevant
> anymore after backporting some cloudant features
> 17:35:11 <+Kxepal> but still may be handy if you find a way how (:
> 17:36:54 <+Kxepal> if the implementation is a set of widgets, I
> believe you could make some builtin and leave a template one to let
> the end users create
>                    their own if they're able/would like to. in future
> these are could be fauxton plugins or something.
> 17:39:15 <+Kxepal> cluster quick-management is also nice idea for a hot
> widget.
> 17:39:56 <+robertkowalski> good idea - i can definitely help with that
> (add custom widgets on build time) - the build is complicated, but
> once explained
>                            it should be easy
> ```
>
> So we have "custom widgets", "cluster quick-management", " recently
> visited databases",  "active tasks" and "_users/_replicator quick
> management"
>
> I think two good widgets for starting are active tasks and recently
> visited databases.
>
> For active tasks we have some nice docs:
>
> https://couchdb.readthedocs.org/en/1.6.1/api/server/common.html#get--_active_tasks
>
> They have an own dedicated page in Fauxton (see
> http://localhost:8000/#/activetasks) but a short quick condensed list
> is probably very interesting to users.
>
> For the recently visited databases we would have to store that somewhere.
>
> If you want, you can take an existing page in Fauxton and just modify
> the markup for a design mockup how the widget view may look like. But
> feel also free to use pen/paper or other tools if you like that the
> most.
>
> For the mango feature I am currently working on, I took the "edit
> view" template on modified the markup using the Chrome inspector of my
> browser to collect some first feedback from the project members and my
> team (https://cloudup.com/c26xgbWb6Ur). It does not have any
> functionality, but gives other folks a rough idea what my idea for the
> feature is.
>
> the framework and react
>
> As I already mentioned we are using React.js.
>
> It would be nice if you can finish the tutorial at
> https://github.com/ryanflorence/react-training/tree/gh-pages/lessons
> until next friday by following the steps and writing that code. After
> that, read
> https://medium.com/brigade-engineering/what-is-the-flux-application-architecture-b57ebca85b9e
> to get a first impression how the Flux pattern works that we are
> using.
>
> After that (if you still have time left) take a look on a component
> that Garren, my coworker refactored from Backbone.js to React:
>
>
> https://github.com/apache/couchdb-fauxton/commit/8cbf95d34a191770cfaadf7df98e07b5652e7602
>
> Please take a look how the data flows from the Components, using the
> Actions, to the dispatcher at the Store. Feel free to litter
> everything in the code with console.log to see how state changes and
> how the data flows.
>
> Hint: it is that element: https://cldup.com/4eCHVt9HHt.png
>
>
> If you still have time, just try to create another menu item, called
> "Dashboard". Take a look at:
>
>
> https://github.com/apache/couchdb-fauxton/blob/master/settings.json.default#L8
> https://github.com/apache/couchdb-fauxton/tree/master/app/addons/config
>
> to get a first idea how to do that. Some background information:
>
> base.js - the starting point of our module. basic configuration is done
> here
> Question: what is `base.js` used for in the case of the config module?
>
> routes.js - takes care that functions injecting the view into the
> layout are called depending on the url given
> Question: What happens if I call `http:localhost:8000/_config` and
> what happens if you remove the function `apiUrl`?
>
> views.js - contains our views - this file contains still a lot
> backbone views, which we are currently migrating to react. maybe it
> makes more sense to take a look at one of our react components:
>
>
> https://github.com/apache/couchdb-fauxton/tree/master/app/addons/documents/changes
>
> and how they are used currently (as we are migrating to react currently):
>
>
> https://github.com/apache/couchdb-fauxton/blob/master/app/addons/documents/routes-documents.js#L195
>
> https://github.com/apache/couchdb-fauxton/blob/master/app/addons/documents/views-changes.js#L31
>
> The Objects are injected into the closures using AMD:
>
>
> https://github.com/apache/couchdb-fauxton/blob/master/app/addons/documents/views-changes.js#L13-24
>
> assets folder:
> contains our less which is compiled to css
>
> templates folder:
> contains old backbone.js templates, you will not need them
>
> tests folder:
> contains unit and integration tests, every PR must have unit tests and
> integration tests. If you never wrote tests, we will explain it to you
> - it is easy once you wrote your first few ones. Basically you are
> testing each time that if you put something into a function, the
> expected result happens. Or that if you take an action, a state has
> changed.
>
> You can run the unit tests using `grunt test`
>
> Single tests are run by:
>
> ```
> grunt test --file="./app/addons/documents/tests/headerSpec.react.js"
> ```
>
> or in the browser by test group:
>
> ```
>
> file:///Users/robert/apache/couchdb-fauxton/test/runner.html?grep=Header%20Controller
> ```
>
> (change path to your fauxton directory)
>
> The corresponding code is:
>
> https://github.com/apache/couchdb-fauxton/blob/master/app/addons/documents/tests/headerSpec.react.jsx
>
> and these tests are a good example how to write a simple test for the
> hello world/hello from dulanga-component:
>
>
> https://github.com/apache/couchdb-fauxton/blob/master/app/addons/documents/tests/headerSpec.react.jsx#L43-61
>
>
> First steps:
>
> Create a module `dashboard` that gets displayed in the sidebar. The
> route http://localhost:8000/dash will render a small React component
> that display "Hello World".
>
> If you click on the "Hello World" it ill change the content to: "Hello
> from Dulanga"
>
> While we will throw the small component away afterwards we will build
> upon the other code you created. If you have time left, add a test
> that the component changes the content.
>
>
> Meeting Wednesday:
> Feel free to join us on our weekly couchdb meeting:
>
> http://mail-archives.apache.org/mod_mbox/couchdb-dev/201503.mbox/%3CCAJ1bcfEKOh4nvoxUqvcAcUFgg96w-JqHEefpi%2BWzazKFUPXNCg%40mail.gmail.com%3E
>
> I will be around at least one hour before so we can chat. Contact me
> if you would like to chat earlier/later. I am also around the other
> days on IRC / the mailinglist and feel free to contact me in
> #couchdb-dev at any time. If I am not around I will answer you once I
> got online again, as I read the backlog.
>
>
> Our checklist at Wednesday (lets see how far we'll get)
>
>  - check out the active tasks api (linked on top of this mail)
>  - a mockup showing some widgets and how they could look like
>  - code React tutorial & read about Flux
>  - take a look how we are using React
>  - create another menu item, called "Dashboard", try to answer the
> questions to route.js et al
>  - get familiar how we test our code
>  - write an hello world / hello from dulanga component that is
> rendered into a screen when opening http://localhost:8000/dash or by
> clicking on "dashboard" in the sidebar
>
> That was a lot of content and please don't feel discouraged if you
> don't get that far until Wednesday. We will have to find a speed which
> is perfect for you and this time I tried to give enough informations
> that you are not blocked until Wednesday by waiting for next steps. If
> you are at the last step before Wednesday, drop me a line and I will
> prepare the next steps :)
>
> I know that you all have important exams, these are definitely more
> important! Don't feel pressured by the amount of work / the amount of
> informations, getting good results in the exams should be your first
> priority.
>
> Best,
> Robert
>
> On Sat, Mar 14, 2015 at 9:14 PM, Dulanga Sashika <wadsashika@gmail.com>
> wrote:
> > Hi Robert,
> >
> > I went through the guidelines you provided and successfully installed and
> > configured as you said. Everything works find and I played around it by
> > creating a database and documents. I think I am ready for the next step
> and
> > we can start it if you are ok :)
> >
> > Thank You
> >
> > On Sun, Mar 15, 2015 at 12:03 AM, Robert Kowalski <rok@kowalski.gd>
> wrote:
> >
> >> You're welcome.
> >>
> >> I also hang out in the couchdb-dev channel for around 1-3hrs if you get
> >> stuck!
> >>
> >> On Sat, Mar 14, 2015 at 7:29 PM, Dulanga Sashika <wadsashika@gmail.com>
> >> wrote:
> >> > Hi Robert,
> >> >
> >> > Thank you very much for the quick reply. I will go through the
> guidelines
> >> > and contact you if I have any issue with them.
> >> >
> >> > Thank you
> >> >
> >> > On Sat, Mar 14, 2015 at 11:46 PM, Robert Kowalski <rok@kowalski.gd>
> >> wrote:
> >> >
> >> >> Hi Dulanga,
> >> >>
> >> >> glad you found your way to the CouchDB mailing list. Welcome :)
> >> >>
> >> >> CouchDB is a database written in Erlang with an HTTP API - that makes
> >> >> it a great fit for web applications that don't need a server side
> >> >> layer with a database driver in between. Our Project Fauxton (like
a
> >> >> modern PHP MyAdmin) makes use of that fact.
> >> >>
> >> >> Many of us hang out in freenode in #couchdb-dev including myself.
> >> >> Whenever you get stuck, feel free to ask - if no one is online (e.g.
> I
> >> >> was travelling this week) feel free to ask on the dev ML.
> >> >>
> >> >> We are all happy to help each other in the project :)
> >> >>
> >> >> If you are using windows: I am not a Windows expert - you will
> >> >> probably have to use a bash emulator like "git bash" to boot the dev
> >> >> environment.
> >> >>
> >> >> Getting started:
> >> >>
> >> >> For this project you will need to install at least CouchDB 1.x, an
> >> >> Ubuntu package (with installation instructions) is at
> >> >> https://launchpad.net/~couchdb/+archive/ubuntu/stable
> >> >>
> >> >> Additionally you need to install Node.js 0.10 or 0.12 (install from
> >> >> https://nodejs.org)
> >> >>
> >> >> Booting Fauxton and first steps (type without the $):
> >> >>
> >> >> booting CouchDB:
> >> >> $ sudo couchdb
> >> >>
> >> >> in another terminal, clone the admin interface:
> >> >> $ git clone https://github.com/apache/couchdb-fauxton
> >> >>
> >> >> go to Fauxton:
> >> >> $ cd couchdb-fauxton
> >> >>
> >> >> install dependencies:
> >> >> $ npm install
> >> >> $ npm install -g grunt grunt-cli
> >> >>
> >> >> boot the app:
> >> >> $ grunt dev
> >> >>
> >> >> Then open your browser and go to http://localhost:8000 - you should
> >> >> see a red/gray/black interface
> >> >>
> >> >>
> >> >> That was a lot of input and especially if you are using Linux the
> >> >> first time and followed the instructions you have archived a lot!
> >> >>
> >> >> As first step, try to create a database and a document now using the
> >> >> web interface (PS we are happy about any usability feedback). :)
> >> >>
> >> >> I think you have your dev environment for CouchDB ready now.
> >> >>
> >> >> What's next:
> >> >> If everything works we will take a look at Fauxtons code structure
> and
> >> >> how it works. We will also talk about the features of the dashboard.
> >> >> Let's find a date for a chat after you took a first look how Fauxton
> >> >> looks like.
> >> >>
> >> >> We are having our weekly meeting this Wednesday, 20:00GMT
> >> >> (http://arewemeetingyet.com/UTC/2015-03-14/20:00) in IRC on freenode
> >> >> (see
> >> >>
> >>
> http://mail-archives.apache.org/mod_mbox/couchdb-dev/201503.mbox/%3CCAJ1bcfEKOh4nvoxUqvcAcUFgg96w-JqHEefpi%2BWzazKFUPXNCg%40mail.gmail.com%3E
> >> >> )
> >> >> . Feel free to join us! I will be around 1hr before if you want to
> >> >> chat with me before.
> >> >>
> >> >>
> >> >> Looking forward to work with you,
> >> >> Robert
> >> >>
> >> >> On Sat, Mar 14, 2015 at 7:55 AM, Dulanga Sashika <
> wadsashika@gmail.com>
> >> >> wrote:
> >> >> > Hi all,
> >> >> >
> >> >> > I am Dulanga Sashika and I am a final year undergraduate student
at
> >> >> > Computer Science and Engineering department at University of
> Moratuwa,
> >> >> Sri
> >> >> > Lanka. I am really interested in java, java script, web
> applications,
> >> >> > algorithms, data mining and machine learning. I have 6 months
of
> >> training
> >> >> > experience at Proavos (pvt) Ltd. and in there I worked on a web
> >> >> application
> >> >> > that used java, JEE and Spring Framework. My final year project
> also a
> >> >> web
> >> >> > related application and I used same technologies I mentioned above
> for
> >> >> > that. I am really interested in this project because I have a
good
> >> >> > experience with web applications and I love work with javascript.
> I am
> >> >> > looking forward to contribute to this project in this summer.
I
> like
> >> to
> >> >> > know more detail about this project and if you can, please guide
> me to
> >> >> > start working on this project.
> >> >> >
> >> >> > Thank you.
> >> >> >
> >> >> > W. A. Dulanga Sashika,
> >> >> > Undergraduate Student,
> >> >> > Department of Computer Science and Engineering,
> >> >> > University of Moratuwa.
> >> >>
> >> >
> >> >
> >> >
> >> > --
> >> > W. A. Dulanga Sashika,
> >> > Undergraduate Student,
> >> > Department of Computer Science and Engineering,
> >> > University of Moratuwa.
> >>
> >
> >
> >
> > --
> > W. A. Dulanga Sashika,
> > Undergraduate Student,
> > Department of Computer Science and Engineering,
> > University of Moratuwa.
>



-- 
W. A. Dulanga Sashika,
Undergraduate Student,
Department of Computer Science and Engineering,
University of Moratuwa.

Mime
  • Unnamed multipart/alternative (inline, None, 0 bytes)
View raw message