По мотивам вопросов чатика react.js@telegram
Оффтоп: пожалуйста, не нужно в сотый раз объяснять уже набившую оскомину тему новичку, который задаст подобный вопрос. Просто поделитесь ссылкой на этот текст. С уважением, Андрей @XaveScor Звёздочка
Краткий ответ на этот вопрос, если вы не хотите разбираться детальнее:
| // This is an advanced example! It is not typically required for application code. | |
| // If you are using a library like Redux or MobX, use the container component provided by that library. | |
| // If you are authoring such a library, use the technique shown below. | |
| // This example shows how to safely update subscriptions in response to props changes. | |
| // In this case, it is important to wait until `componentDidUpdate` before removing a subscription. | |
| // In the event that a render is cancelled before being committed, this will prevent us from unsubscribing prematurely. | |
| // We also need to be careful about how we handle events that are dispatched in between | |
| // `getDerivedStateFromProps` and `componentDidUpdate` so that we don't put stale values into the `state`. |
| import React, { Component } from 'react'; | |
| import { graphql } from 'react-apollo'; | |
| import { gql } from 'graphql-tools'; | |
| const QUERY = gql` | |
| query MatchesByDate($date: Int) { | |
| matches(date: $date) { | |
| id | |
| minute | |
| period |
| import React, { Component } from 'react' | |
| import { BrowserRouter as Router, Route, Link, Match, Redirect, Switch } from 'react-router-dom' | |
| import OverviewPage from './page/OverviewPage' | |
| import AccountPage from './page/AccountPage' | |
| /* | |
| Layouts, inline define here for demo purpose | |
| you may want to define in another file instead | |
| */ |
| to check if the server works - https://webrtc.github.io/samples/src/content/peerconnection/trickle-ice | |
| stun: | |
| stun.l.google.com:19302, | |
| stun1.l.google.com:19302, | |
| stun2.l.google.com:19302, | |
| stun3.l.google.com:19302, | |
| stun4.l.google.com:19302, | |
| stun.ekiga.net, | |
| stun.ideasip.com, |
| RN < 0.50 - watchman watch-del-all && rm -rf $TMPDIR/react-* && rm -rf node_modules/ && npm cache clean && npm install && npm start -- --reset-cache | |
| RN >= 0.50 - watchman watch-del-all && rm -rf $TMPDIR/react-native-packager-cache-* && rm -rf $TMPDIR/metro-bundler-cache-* && rm -rf node_modules/ && npm cache clean && npm install && npm start -- --reset-cache | |
| RN >= 0.63 - watchman watch-del-all && rm -rf node_modules && npm install && rm -rf /tmp/metro-* && npm run start --reset-cache | |
| npm >= 5 - watchman watch-del-all && rm -rf $TMPDIR/react-* && rm -rf node_modules/ && npm cache verify && npm install && npm start -- --reset-cache | |
| Windows - del %appdata%\Temp\react-native-* & cd android & gradlew clean & cd .. & del node_modules/ & npm cache clean --force & npm install & npm start -- --reset-cache |
Picking the right architecture = Picking the right battles + Managing trade-offs
| 'use strict'; | |
| var | |
| gulp = require("gulp"), | |
| wiredep = require("wiredep").stream, // авто прописывет файлы из bower | |
| useref = require("gulp-useref"), // перемещает index.html | |
| uglify = require("gulp-uglify"), // минимизирует js | |
| clean = require("gulp-clean"), // удаление файлов, папок | |
| gulpif = require("gulp-if"), // объединяет файлы в поток | |
| filter = require("gulp-filter"), // фильтрует |
| .comPlainTextContentEditable { | |
| -webkit-user-modify: read-write-plaintext-only; | |
| } | |
| .comPlainTextContentEditable--has-placeholder::before { | |
| content: attr(placeholder); | |
| opacity: 0.5; | |
| color: inherit; | |
| cursor: text; | |
| } |
