electrode-io / electrode-io.github.io Goto Github PK
View Code? Open in Web Editor NEWThe public website of the Electrode platform
Home Page: http://www.electrode.io/
License: Other
The public website of the Electrode platform
Home Page: http://www.electrode.io/
License: Other
What is:
--passing in the "cache config"
--"The simple caching strategy is basically doing a JSON.stringify on the component's props." What does that mean?
--hashing
TODO: Arpan get the GA token from Marina
Should we have them npm install grunt-cli with electrode?
Apache 2.0 license.
The third code box in Add Data is kind of confusing.
The text say Add the code below between your components tags:
and in the code box it says -insert code below here
. What is the code to insert ?
The next code block and last one show the final code.
I don't see a reason for the third code box, I think you should just tell user to replace the code by copy/pasting the whole code from the 4th code block. It it more coherent with previous doc pages as well.
Should not forget to mention to replace YourAwesomeComponent
with whatever name the user used to create the component previously (as mentioned in previous doc pages)
https://github.com/electrode-io/electrode-io.github.io/blob/develop/_docs/01.2-why_use_electrode.markdown --- Sounds like a marketing pitch for WalmartLabs and doesn't clearly explain the pain points and goals of Electrode.
What is a "transform"?
We need to callout that electrode by default is SSR.
The code copy/past from build a server plugin Build a Server Plugin leads to may lint issues down the line when running lint check:
/Users/blemair/Code/my-electrode-app/server/plugins/friends/index.js
1:1 error Strings must use doublequote quotes
4:2 error Expected indentation of 0 space characters but found 1 indent
5:2 error Expected indentation of 0 space characters but found 1 indent
6:2 error Expected indentation of 0 space characters but found 1 indent
7:2 error Expected indentation of 0 space characters but found 1 indent
8:2 error Expected indentation of 0 space characters but found 1 indent
11:1 error Expected indentation of 1 space character but found 0 indent
13:2 error Expected indentation of 0 space characters but found 1 indent
15:2 error Expected indentation of 0 space characters but found 1 indent
18:1 error Line 18 exceeds the maximum line length of 100 max-len
22:1 error Line 22 exceeds the maximum line length of 100 max-len
27:10 error `githubUrl` is never modified, use `const` instead prefer-const
27:42 error Strings must use doublequote quotes
33:8 error Identifier 'per_page' is not in camel case camelcase
37:1 error Line 37 exceeds the maximum line length of 100 max-len
37:10 error ["friends"] is better written in dot notation dot-notation
37:53 error Identifier 'avatar_url' is not in camel case camelcase
37:53 error Identifier 'avatar_url' is not in camel case camelcase
37:95 error Identifier 'avatar_url' is not in camel case camelcase
39:10 error Missing semicolon semi
44:28 error Gratuitous parentheses around expression no-extra-parens
45:35 error Missing semicolon semi
57:2 error Expected indentation of 0 space characters but found 1 indent
What is:
--Markup
--child component
--server side rendering (if I haven't asked already)
https://github.com/electrode-io/electrode-io.github.io/blob/develop/_docs/03.1-create_reusable_component.markdown mentions "This Service-oriented Architecture ". I am not sure what that has to do with the components.
Link standalone modules with their correct example apps
Fix broken links within website navigation (caused by renamed + moved files).
I'll take this one.
Define "high level"
What are:
--a predictable state container
--a local scope vs. a global scope (for CSS)
--"a powerful tool that makes NodeJS require understand files such as images for SSR." Require understand? What does that mean?
--a pluggable linting utility
-- a scaffolding tool
--Cross Site Request forgery
--a routing and rendering engine
--profiling and component caching
--a module tree
--a metadata extractor
--Define "high level"
--What is "container based technology"?
--What's "platform agnostic" and "multi instance"?
--Markup
--child component
--server side rendering (if I haven't asked already)
--passing in the "cache config"
--"The simple caching strategy is basically doing a JSON.stringify on the component's props." What does that mean?
--hashing
-- a promise library
-- a stub
--a route handler
--react-dataids
--What is a "transform"?
--What is "babel transpile"?
What is "container based technology"?
What is "babel transpile"?
Below statement in the usage section of 'Above the folder server render' is not very clear.
'By default, the above-the-fold-only-server-render component is an exercise in simplicity; high-level it returns the child component.'
cover all features as well.
we need to explain why its abstracted and standalone
Instead of saying make a new directory, then generate, then fill out application, etc
Can we do
npm install -g yo generator-electrode
yo electrode
*show the generator information requests here filled with dummy information*
Add gulp installation in pre-reqs across various components or at least in the 'Pre-Requesites' of Generator-electrode
the code snippets SNIPPET
, doesn't look like code snippets, just weird font for that text
We have two paragraphs for requirements, instead of a list or something shorter?
When following deploy-app instructions to the letter, when I run heroku open
the app fails to launch in the browser (I see an Application Error screen).
Found out that the origin of the error is due to a missing step in the documentation page.
After adding the engine section (for node 4.2.x) in package.json, the change needs to be comitted to git (otherwise it does not get pushed to heroku when running git push heroku master
, and heroku install a wrong node version).
After It should now look like this
(and before Create an app on Heroku
(which prepares Heroku to receive your source code) you should add something along the line of :
You should now commit your changes
$ git add .
$ git commit -m "Update package.json"
Wrongly formatted text
Found out a lot of entries referring to files, that seems to be wrongly formatted. For example
<your-awesome-app'>/client/styles/base.css:
I think it should be <your-awesome-app>/client/styles/base.css
instead
Search for <your-awesome-app'> in the page to find all of them.
Wrong link
At the end of the page it links to Intermediate: Create a Standalone Component
. However this page does not exist in the doc. It should rather be Intermediate: Create a Reusable Component
.
At the end of the deploy-app documentation page, it is said to create a Procfile
text file and add some code into it.
However, Profile
is part of .gitignore
, so when running git push heroku master
, nothing new will be pushed (the Procfile
file won't be).
If this step needs to be done, Procfile
should be removed from .gitignore
and two steps should be added before git push heroku master
: git add .
and git commit -m "Add Procfile"
.
If this step does not need to be done, then it should be removed from the doc.
Few confusing stuff in the In the Add Routes page :
Navigate to <your-awesome-component>/client/routes.jsx.
), should it rather read Navigate to <your-awesome-app>/client/routes.jsx.
(as there is no client folder in my component folder).Change from the literal YourAwesomeComponent to your actual component name:
>>> this mention is not needed as there is no YourAwesomeComponent
reference in code from this page,It's basically a link to another page?
React * Redux * CSS Modules * Electrode-Server * Electrode Confippet * Universal JavaScript Babel * Webapack * Webpack Isomorphic Loader * React-Router * History React-Resolver * Electrode Bundle Analyzer Electrode-Static-Paths * Lodash * Electrode-Docgen * Bluebird * Gulp * ESLint * Mocha * Enzyme * Travis * Yeoman
In Build and Demo page, when running command gulp build && gulp demo
I get an error saying Task 'demo' is not in your gulp file
.
Looking at my project gulpfile.js
, I can see require("electrode-archetype-react-app")();
. Looking at my local electrode-archetype-react-app
module (v1.2.0
), I can see indeed that no demo
task is present in arch-gulpfile.js
file.
Same problem in Generate Docs.
generate-metadata
generate-documentation
and generate
are non defined gulp tasks
The heart of the platform is Electrode Archetypes. It allows for standardized configurations/structure of the app and its associated react components, also ensures streamlined development and deployment.
My first question is than, what is an archetype?
Where do I go to find out WHAT it is?
Where do I go to find out everything it does
Where do I go to find out how to use it?
Tomorrow add:
Final Intermediate app image
Links to our deployed component and app
Links to our GitHub repo of component and app
Under 'Build More' section -
Currently it is referred as -
'Let's finish the UI by adding styles. Navigate to /client/styles/base.styl and add the code below. A reminder: Stylus is white-space-sensitive.'
change that to 'base.css'
instead of doing:
[generator-electrode-component](https://github.com/electrode-io/generator-electrode-component)
in the markdown doc.
try this:
blah blah blah [generator-electrode-component] blah blah blah
blah blah blah
then you can use the same link again like this [generator-electrode-component] blah blah blah
blah blah blah
[generator-electrode-component]: https://github.com/electrode-io/generator-electrode-component
What is:
-- a promise library
-- a stub
--a route handler
--react-dataids
When following instructions in Create a Reusable Component page, I get an error at some point when running gulp check
command part of Develop Tests section .
The linter fails to invalidly formatted file home.jsx
created previously by copy/pasting it from Build Component page.
Here are the linter errors :
/Users/blemair/Code/my-electrode-app/client/components/home.jsx
4:3 error Strings must use doublequote quotes
5:3 error Strings must use doublequote quotes
6:3 error Strings must use doublequote quotes
7:3 error Strings must use doublequote quotes
8:1 error Line 8 exceeds the maximum line length of 100 max-len
8:3 error Strings must use doublequote quotes
11:8 error Unexpected var, use let or const instead no-var
11:13 error Infix operators must be spaced space-infix-ops
14:25 error "i" is already declared in the upper scope no-shadow
25:26 error Expected parentheses around arrow function argument arrow-parens
File home.jsx
in Build Component needs to be edited accordingly to remove all linter errors.
reference example: https://github.com/wellyshen/react-cool-starter#features
On the Build and Demo page, running gulp build && gulp demo
does not automatically open a browser to show the demo.
It should be mentioned that after running this command line, the user should navigate to http://localhost:4000
in a browser to see the demo running.
Running gulp hot
fails because OAUTH2 token is not found.
In Build a Server Plugin page, there is a quick reference to setting token locally token='your-token-here'
but not mentioned when actually useful.
gulp hot
command should indeed be token='your-token-here' gulp hot
to run gulp hot while providing it the token (or set the token in another manner ... whatever is best)
What's "platform agnostic" and "multi instance"?
In Add Routes page code for the component, it references electrode-houseparty-example-component
(import { HouseParty } from "electrode-houseparty-example-component";
).
This component does not exists so when I reach the Server Config page, and I run gulp hot
, the command fails :
ERROR in ./client/routes.jsx
Module not found: Error: Cannot resolve module 'electrode-houseparty-example-component' in /Users/blemair/Code/my-electrode-app/client
@ ./client/routes.jsx 14:43-92
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.