Hi, Here I attached the screen shots of Dashboard menu item. Now its working. Now I want to know that, if I need to implement react component, where should I put it? And how can I access that to render the view? just give me some hints and I can carry on from there.
Regards On Thu, Mar 19, 2015 at 10:15 PM, Dulanga Sashika <wadsash...@gmail.com> wrote: > Hey Robert, problem solved.. :) > > > Regards. > > On Thu, Mar 19, 2015 at 9:52 PM, Dulanga Sashika <wadsash...@gmail.com> > wrote: > >> Hi Robert, >> >> Now I am trying to create a new menu item for dashboard and implement a >> react component as you said. But now I am stuck in some place and couldn't >> figure out the problem yet. Here is the problem I had in process. I added >> dashboard menu item and added route and view for that. And i change the >> code to render dashboard when we enter http://localhost:8000 . As in >> img1 and img2, it doesn't show the view I created. But when I click on >> another menu item and come back to the dashboard, it shows the breadcrumb >> of previous pages as img 3 and 4. As in >> https://github.com/apache/couchdb-fauxton/blob/master/app/addons/databases/routes.js#L46 >> , I called the new Dashboard.view() which is a component in my view.js. But >> in the console, it shows Uncaught Type error. Did I miss any configuration >> thing or did I do it wrong? >> >> On Thu, Mar 19, 2015 at 10:06 AM, Dulanga Sashika <wadsash...@gmail.com> >> wrote: >> >>> Hi Robert, >>> >>> Thank you very much for the reference. I started to write the proposal >>> today. I hope you will help to write this proposal by reviewing it. I will >>> share it with you after complete the draft of the proposal. >>> >>> Thank you >>> >>> On Thu, Mar 19, 2015 at 3:21 AM, Robert Kowalski <r...@kowalski.gd> >>> wrote: >>> >>>> Some of you asked for a template for their proposals, here is what I've >>>> found: >>>> >>>> http://community.staging.apache.org/gsoc#application-template >>>> >>>> Best, >>>> Robert >>>> >>>> On Tue, Mar 17, 2015 at 10:39 PM, Robert Kowalski <r...@kowalski.gd> >>>> wrote: >>>> > Wow you are making very good progress! >>>> > >>>> > We have our weekly status meetup tomorrow (see [1] for the time in >>>> > your timezone), feel free to join, meet other project members and >>>> > learn what the project is currently doing next to the Summer of Code. >>>> > >>>> > I will also be around 1hr earlier to answer all your questions and >>>> > discuss our next steps. >>>> > >>>> > >>>> > [1] >>>> http://mail-archives.apache.org/mod_mbox/couchdb-dev/201503.mbox/%3CCAJ1bcfEKOh4nvoxUqvcAcUFgg96w-JqHEefpi%2BWzazKFUPXNCg%40mail.gmail.com%3E >>>> > >>>> > On Tue, Mar 17, 2015 at 1:52 PM, Dulanga Sashika < >>>> wadsash...@gmail.com> wrote: >>>> >> 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 <r...@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 < >>>> wadsash...@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 < >>>> r...@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 < >>>> wadsash...@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 < >>>> r...@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 < >>>> >>> wadsash...@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. >>>> >>> >>> >>> >>> -- >>> 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.
