Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

fleur

Privileged
  • Joined

  • Last visited

Everything posted by fleur

  1. I tried to install lmde on my new hp, but deleted boot sector sdb. I tried install lmde betsy on unnalocated space but failed. I have grub rescure mistake. Next time i start my computer i have grub rescure mistake. Two day can,t solve. Headache Please, help!
  2. The same problem for me. I need to buy new laptop in a short time. I am not specialist in hardware at all and strongly need your advice. I found this site but author recommended Dell and Lenovo. I am not shure that this brends has decent quality. My goals: programming and design (webstorm, Sublime, for js and node, local dev server, two OS (windows, linux), Photoshop, Illustrator. Options. Screen: 15,6 inch IPS, Full HD SSD hard drive 256 GB (min) Processor Intel i7 6700HQ (i5 -6300HQ) . Q - much more powerfull then U RAM - 8 GB (min) DDR 4 (3) 16GB Video card: NVidia GTX 960M or GeForce (or similar) Wi-Fi, Bluetooth etc. Comfortable keyboard! I have 800$, but i can find extra money if laptop wll be decent. I will greatly appriciate your advices, because now my old laptop complitely broken and i need to find new one fast.
  3. Thank you very much for sharing this! I think, we need "pinned" theme where forum members can post theirs React app and questions about creating and testing React components.
  4. fleur replied to Jack's topic in Frontend
    Thank you very much for advice and link! I can't continue learning Dan Abramov course about Router because he use Node.js and Express.js for dev server. I don't know it So.. yes, i agree, it's better for me to make something on React first. I am going to make deleteTodo and editTodo function for practise.
  5. fleur replied to Jack's topic in Frontend
    Wynn, thank you much! I will search for more practical examples for to see this in action.
  6. fleur replied to Jack's topic in Frontend
    I just watching Dan Abramov lessons and see the unknown syntax [action.id]: todo(state[action.id], action) It means that all ids will combine in array. Can someone tell me, please, how this syntax is called? [action.id]: Looks like some sort of object name destruction. I want to seach more about it but i need to know how it called at first.
  7. fleur replied to Jack's topic in Frontend
    Maybe usefull. Just found this. https://medium.com/@dan_abramov/how-to-use-classes-and-sleep-at-night-9af8de78ccb4#.6cqlqzc8q https://github.com/filipelinhares/ress
  8. fleur replied to Jack's topic in Frontend
    Thank you !!! I understand the things that i didn't understand in the past for a long time
  9. fleur replied to Jack's topic in Frontend
    Awesome! Thank you very much! If understand right - there is in destruction { value, next } value - 1 next - { value: 2, next: { value: 3, next: { value: 4, next: null } } } And if (next) means (if 'object)? Can i ask - what mistake was in my function? What if i will have a task to can get values from random names, not only from value and next.
  10. fleur replied to Jack's topic in Frontend
    I saw Mattias video's not a one time and decided make something similar. Because in front end the most common task is to get values from nested objects, i tried to use recursion and reduce for that. For example if i have nested object let someList = { value: 1, next: { value: 2, next: { value: 3, next: { value: 4, next: null } } } }; How i can get values in reverse order? I tried this function reversePrint(node) { Object.keys(node).map(key => { let myKey = node[key]; if(typeof myKey == "object") { reversePrint(myKey); } console.log(myKey); }); } reversePrint(someList); Worked, but not in reverse order and i have mistake with null. Also i tried push values to an array, but i don't understand why every value create it's own array? function reversePrint(node) { Object.keys(node).reduce((array, key) => { let myKey = node[key]; if(typeof myKey == "object") { reversePrint(myKey); } array.push(myKey); console.log(array); }, []); } reversePrint(someList); I will be very greatfull for advice where to find a mistake.
  11. fleur replied to Jack's topic in Frontend
    Robert, thank you very much! I was confused with arguments also.
  12. fleur replied to Jack's topic in Frontend
    Solved
  13. fleur replied to Jack's topic in Frontend
    Today i was asked to pass the test. function bind(method, context) { var args = Array.prototype.slice.call(arguments, 2); return function() { var a = args.concat(Array.prototype.slice.call(arguments, 0)); return method.apply(context, a); } } The question was: how this function working and for what it can be used. I understand that function bind (and return function too) convert array-like arguments into a real array. Method and context is not converted into array (because of 2 index). I can pass extra args in bind function and args into returned function and call method with context as 'this'. My question is - how it can be used, in what cases. Is method and context - function or objects, or function and object? If someone can provide live example it will be awesome!
  14. fleur replied to Jack's topic in Frontend
    Thank you very much, Jack! I will take a look on both
  15. fleur replied to Jack's topic in Frontend
    Thank you for advice with course! I passed this course. I used webpack with localhost for this app. It working. But for next step i need to save text, because when i close browser, text dessapeared. Can you give me advice - what technologies is the best for my needs? LocalStorage, MongoDB? Or maybe it outdated now and there are new trends in this area? PS. fetch is working. I understand that i have problem with paths in webpack, because i see in console that file.json is underfined.
  16. fleur replied to Jack's topic in Frontend
    You are talking about this course?
  17. I think it's interesting idea! We can add to the playlist not only video about singers. Every one (who wants it) can add it's own video (about him/herself, street, people, working process, playing gitar, rest, video inside office etc). It will WDF discovery. So i can travelling everywhere from home. It will be awesome! Also it can be youtube channel, where WDF users can put there favorite music and other stuff, for example video from conference. Anyway, i would like to share my favorite blues 01 Sweet Little B.B. (Blues Backing Track In A) from Jam Blues II
  18. Wynn, thank you very much for info! I just tried to make simple request with Lyndsey's JSON. I put all loaders and polyfill but it doesn't work. I tried all! Here is my files. test.json [ { "name": "Lyndsey Browning", "email": "lbrowning86@somewhere.com" }, { "name": "Dan Abramov", "email": "gaearon@somewhere.com" }, { "name": "Pete Hunt", "email": "floydophone@somewhere.com" } ] feth.js require('./test.json'); import 'whatwg-fetch'; const User_fetch = React.createClass({ getInitialState:function() { return { username:[] }; }, componentDidMount:function() { fetch('./test.json') .then((response) => response.json()) .then((responseData) => { console.log('parsed json', responseData); this.setState({ username: responseData }); }).catch((error) => { console.log('Error fetching and parsing data', error); }); }, render:function() { return ( <div> {this.state.username} </div> ); } }); export default User_fetch; main.js require('../../build/index.html'); import User_fetch from './fetch.js'; const App = () => ( <div> <p>Hello React!</p> <User_fetch /> </div> ); ReactDOM.render(<App />, document.body); webpack.config var webpack = require('webpack'); var path = require('path'); var HtmlWebpackPlugin = require('html-webpack-plugin'); var config = { devtool: 'eval-source-map', entry: ['whatwg-fetch', __dirname + "/src/js/main.js"] , output: { path: __dirname + "/build", filename: "bundle.js" }, resolve: { extensions: ['', '.js', '.jsx'] }, devServer: { contentBase: './build', hot: true // Activate hot loading }, module : { loaders : [ { test : /\.jsx?/, exclude: /node_modules/, loader : 'babel' }, { test: /\.json$/, loader: 'json' }, { test: /\.html$/, loader: "raw-loader" } ] }, plugins: [ new HtmlWebpackPlugin({ title: 'Testing fetch API with React' }), new webpack.ProvidePlugin({ 'React': 'react', 'ReactDOM': 'react-dom', '$': 'jquery', Promise: 'imports?this=>global!exports?global.Promise!es6-promise', fetch: 'imports?this=>global!exports?global.fetch!whatwg-fetch' }) ] }; module.exports = config; package.json { "name": "fetch-test", "version": "1.0.0", "description": "Testing fetch API", "main": "index.js", "scripts": { "test": "test", "dev": "webpack-dev-server --port 8080" }, "keywords": [ "54321" ], "author": "OlgaMaraeva", "license": "ISC", "devDependencies": { "babel-core": "^6.9.1", "babel-loader": "^6.2.4", "babel-preset-es2015": "^6.9.0", "babel-preset-react": "^6.5.0", "exports-loader": "^0.6.3", "html-loader": "^0.4.3", "html-webpack-plugin": "^2.19.0", "imports-loader": "^0.6.5", "json-loader": "^0.5.4", "react-hot-loader": "^1.3.0", "webpack": "^1.13.1", "webpack-dev-server": "^1.14.1" }, "dependencies": { "es6-promise": "^3.2.1", "react": "^15.1.0", "react-dom": "^15.1.0", "whatwg-fetch": "^1.0.0" } } For now i see on my webpack dev server only words "Hello React". I tried with $.ajax - cjde working but i really wanted to use native Fetch API. Spent so much time - for nothing:)
  19. Every time i get the same error "Error fetching and parsing data SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data" I tried everything, don't know what to do else)) Fetch don't work even with whatwg in FF
  20. Lyndsey, thank you very much for this example. And for webpack.config too! Tomorrow i will set project from scratch like in your structure and will play with your code. It's only way to avoid mess in my code.
  21. Robert, thank you very much. I mix tools. I think there is my mistake. I need to start a new project and try fetch there.
  22. I was surprised too. I downloaded json-loader via npm. (But i don't see it in package.json). Add line in webpack.config.js module : { loaders : [ { test : /\.jsx?/, exclude: /node_modules/, include : APP_DIR, loader : 'babel' }, { test: /\.json$/, loader: 'json' } ] }, Then i added above text_fetch.jsx line var json = require("json!./test_json.json"); test_json.json in the same folder as text_fetch.jsx And trigger the local file in test_fetch.jsx fetch('/test_json.json') .then((response) => { return response.json() }) .then((json) => { console.log('parsed json', json); const [first] = json; console.log(first); this.setState({ username: first.name }); }).catch(ex => { console.log('parsing failed', ex) }); }, And every time i got Network Error. I don't understand the reason.
  23. Thank you! I was surprised why l can't load local json files with fetch and json loader.
  24. I tried native Fetch API to get this json like fetch("https://davidwalsh.name/demo/arsenal.json", { credentials: 'include' }) .then((response) => { return response.json() }) .then((json) => { const [first] = json; console.log(first); this.setState({ username: first.name }); }).catch(ex => { console.log('parsing failed', ex) }); }, and received "parsing failed TypeError: NetworkError when attempting to fetch resource". Tried fetch polyfill but also failed. Json loader also doesn't work. I found the same issue as mine So.. I think only jQuery and Superagent will really work. I wonder if there is any chance to make fetch (or fetch polyfill) work with webpack.
  25. Wynn, thank you very much for pointing to my mistake with json object and es6 destructuring assignment. I tried with objects also const {title} = data; and this works perfect!

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.