module.exports = {
entrada: (
'./src/main.js'
),
salida: {
nombre de archivo: 'build.js'
},
módulo: {
reglas: (
{
prueba: /.js$/,
excluir: / node_modules /,
utilizar: {
cargador: "babel-loader"
}
}
)
}
};{
"presets": ("@ babel / preset-env", "@ babel / preset-react")
}importar ReactDOM desde "react-dom";
import React desde 'reaccionar'; la aplicación de clase extiende React.Component {
constructor (accesorios) {
super (accesorios);
this.state = {}
}
render () {
regreso (
)
}
} const app = document.getElementById ('aplicación');
if (aplicación) {
ReactDOM.render (, aplicación);
}importar './components/app';
1.3 Git, GitHub και Heroku
1 de 1 paso pasado
Editar
Αε αυτό το μάθημα θα δούμε το απαραίτητο εργαλείο για τους προγραμματιστές – Git.
'' '' ΊΤΤΤΤΤοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοοχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχχΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤΤ. Έχει σχεδιαστεί για το συντονισμό των εργασιών μεταξύ προγραμματιστών, αλλά μπορεί να χρησιμοποιηθεί για την παρακολούθηση αλλαγών σε οποιοδήποτε σύνολο αρχείων.
Ας δημιουργήσουμε ένα αποθετήριο για την εφαρμογή μας web repetitivo! Θα χρησιμοποιήσουμε τη δημοφιλέστερη υπηρεσία GitHub για τις αποθήκες Git.
Βήμα 0: Εγκαταστήστε το git και ελέγξτε την έκδοση git
Βήμα 1: Δημιουργήστε ένα νέο αποθετήριο στο GitHub.
Βήμα 2: Μετονομάστε το φάκελο και αντιγράψτε με git clone αυτό το αποθετήριο
mv mweb3waves / mweb3waves_ / git clone https://github.com/AlekseiPupyshev/mweb3waves.git
μετακινήστε τα αρχεία έργου / φακέλους σε αυτή την αρχική repo.
mv mweb3waves_ / dist / mweb3waves / dist /;
mv mweb3waves_ / node_modules / mweb3waves / node_modules /;
mv mweb3waves_ / src / mweb3waves / src /;
mv mweb3waves_ / index.html mweb3waves / index.html;
mv mweb3waves_ / package.json mweb3waves / package.json;
mv mweb3waves_ / package-lock.json mweb3waves / package-lock.json;
mv mweb3waves_ / server.js mweb3waves / server.js;
mv mweb3waves_ / webpack.config.js mweb3waves / webpack.config.js;
mv mweb3waves _ /. babelrc mweb3waves / .babelrc;
(- αυτή η προσέγγιση δεν είναι η βέλτιστη πρακτική της χρήσης .git με απομακρυσμένη προέλευση.Το Mastering git ή άλλα εργαλεία είναι λίγο έξω από το πεδίο αυτού του μαθήματος Web3.Ωστόσο, παρακαλώ να χρησιμοποιήσετε τις βέλτιστες πρακτικές για εσας.)
Βήμα 3: Δημιουργήστε ένα αρχείο .gitignore στη ρίζα του φακέλου repo
package-lock.json
node_modules /
Βήμα 4: Προσθήκη αρχείων στο git diff tracker και πατήστε commit στο απομακρυσμένο διακομιστή GitHub
git add -A;
git commit -m 'agregar archivos de proyecto';
git push origen maestro;
1.4 guardián de las olas
1 de 1 paso pasado
Editar
Το τελικό μάθημα αυτής της ενότητας προετοιμασίας είναι “Πώς να ενσωματώσετε το Waves keeper;”.
Waves Το Guardián είναι μια επέκταση του προγράμματος περιήγησης που επιτρέπει στους χρήστες να διαχειρίζονται τους λογαριασμούς τους (κλειδιά) kai να αλληλεπιδρούν με ασφάλεια kai ευκολία με Información de hotel Ondas web Dapps kai.
Βήμα 0: Εγκαταστήστε το Waves Keeper και δημιουργήστε ή εισαγάγετε έναν λογαριασμό
Ακολουθήστε τις οδηγίες εδώ.
Βήμα 1: Προσθέστε αλλαγές κώδικα στο αρχείο app.js. Θα καλέσουμε το Waves Keeper για Auth όταν ο χρήστης πιέσει το κουμπί auth.
importar ReactDOM desde "react-dom";
import React desde 'reaccionar'; la aplicación de clase extiende React.Component {
constructor (accesorios) {
super (accesorios);
this.state = {}
this.authFunc = this.authFunc.bind (this);
}
authFunc () {
const authData = {data: "Auth en mi sitio"};
si (WavesKeeper) {
WavesKeeper.auth (authData)
.then (auth => {
console.log (auth); // mostrando el resultado en la consola
/*…Procesando datos */
}). catch (error => {
console.error (error); // mostrando el resultado en la consola
/*… errores de procesamiento * /
})
} más {
alert ("Para Auth WavesKeeper debe estar instalado");
}
}
render () {
regreso (
)
}
} const app = document.getElementById ('aplicación');
if (aplicación) {
ReactDOM.render (, aplicación);
}
Στη συνέχεια, ανοικοδομήστε τον κώδικα javascript από την πλευρά του υπολογιστή-πελάτη:
npm run build
Ας το ανοίξουμε στο http: // localhost: 5000 /. Ανοίξτε το “Εργαλεία ανάπτυξης: Κονσόλα” για να δείτε το επιστρεφόμενο αντικείμενο από το Keeper.
nodo server.js
Βήμα 2: Προσθέστε αλλαγές στο git tracker, δεσμεύστε και πιέστε αλλαγές στο απομακρυσμένο αποθετήριο GitHub στην ενότητ. Ανοίξτε το Heroku και κάντε ξανά κλικ στο "Desplegar" από τον κύριο κλάδο. Ανοίξτε την εφαρμογή Ιστού.
git add -A;
git commit -m 'Waves Keeper Auth integrado';
git push origen maestro;
Βήμα 3: Προσθέστε τον τομέα Heroku στους αξιόπιστους πόρους στις ρυθμίσεις απορρήτου του Guardián για να αποτρέψετε τους χαρακτήρες “απορριφθέντες”
1.5 Η πρώτη πρόκληση (un proyecto de caldera)
1 de 1 paso pasado
Editar
Αυτή είναι η πρώτη σας en línea πρόκληση σε αυτό το μάθημα:
“Σύμφωνα με τα προηγούμενα μαθήματα, δημιουργήστε μια εφαρμογή ιστού” repetitivo “, σπρώξτε την στο GitHub, αναπτύξτε το στο Heroku και μοιραστείτε τους συνδέσμους με το GitHub αποθετήριο και την ανάπτυξη του Heroku.
Υποβάλετε τα εκτυπωμένα αποτελέσματα από την κονσόλα του προγράμματος περιήγησης.
Καλή τύχη! ”
){kind=link}