“Invoering Moreel” is een web3-platform dat een backend-service biedt voor blockchain-projecten. Zij bieden de hoogste aantallen web3- en NFT-API’s voor authenticatie, blockchain-accountinformatie, enz. Wij zullen gebruik maken van de Methode “saveIPFS()” van Moralis IPFS om bestanden met een grootte van maximaal 1GB te uploaden naar het IPFS-netwerk. Deze tutorial is een voortzetting van de les “Hoe bestanden op de Blockchain op te slaan met behulp van IPFS”. Ik raad u aan om deze te bekijken om te begrijpen wat een IPFS-netwerk is. Vereisten. Als eerste vereiste moet u bekend zijn met de basisprincipes van React.js, die u hier kunt leren. Demo. Hieronder vindt u de demovideo van de IPFS-bestandsuploader die wij aan het einde van deze handleiding gaan bouwen: De bestanden die met de Methode “saveIPFS()” zijn geüpload, worden standaard vastgezet op IPFS. Aan het einde van dit gedeelte kunt u bestanden opslaan en ophalen van het IPFS-netwerk met Moralis.
Stap 1 – Moralis server instellen. Met een Moralis-server kunt u de Moralis SDK gebruiken om de ontwikkeling van uw dApp te versnellen. In deze eerste stap gaan wij onze Moralis Cloud Server instellen en onze Moralis Server API-sleutels genereren. Ga naar Moralis.io en klik op de knop “GRATIS Aanmelden”. Geef een geldig e-mailadres en een wachtwoord op om uw Moralis-account aan te maken. Beantwoord enkele korte vragen op de volgende pagina. Klik op Volgende als u klaar bent om uw Moralis-account aan te maken. Na een succesvolle registratie wordt u doorgestuurd naar uw Moralis-dashboard. Op uw dashboard: 1. Klik op de knop “Een nieuwe server maken”. 2. Selecteer de “Mainnet server”. 3. Bevestig uw geregistreerde e-mailadres. 4. Voeg een nieuwe Mainnet-server toe door de volgende gegevens in te voeren in de pop-up: Geef uw Moralis server/instantie een naam (ipfs-uploader-server). Kies de regio die het dichtst bij u in de buurt is. Selecteer een netwerk (Hoofdnet). Voor deze handleiding selecteren wij alle beschikbare kettingen. Klik op de knop “Exemplaar toevoegen” als u klaar bent. 5. Wacht tot Moralis uw serverinstantie heeft ingesteld.
Stap 2 – Details Moralis-server. Nadat onze serverinstantie is gemaakt, kunnen wij onze serverreferenties bekijken door op de knop “Details bekijken” te klikken. De belangrijke servergegevens die wij nodig hebben zijn: De Server-URL en de Applicatie ID. Pro-tip: Geef uw servergegevens niet vrij, aangezien deze toegang geven tot uw dApp.
Stap 3 – Een nieuwe React-app maken. In deze stap maken wij een nieuwe React-applicatie met “Create React App” (CRA) en “npx”-pakketbeheerder. Navigeer vanaf uw terminal naar de map waar u uw IPFS-uploaderproject wilt hebben. Voer de onderstaande opdracht uit om een nieuw moralis-ipfs-uploader React-app-project te maken: npx create-react-app moralis-ipfs-uploader. Wanneer dit is voltooid, voert u de onderstaande opdracht uit om naar de zojuist gemaakte moralis-ipfs-uploader map te navigeren: cd moralis-ipfs-uploader. Start vervolgens uw React-app-projectserver met de onderstaande opdracht: npm run start. Onze ontwikkelingsserver wordt gestart op localhost:3000 en uw React-pagina zou er als volgt uit moeten zien:
Stap 4 – Moralis React SDK installeren. Nu onze React-applicatie gereed is, gaan wij de Moralis React SDK installeren. Voer de volgende opdracht uit vanaf uw moralis-ipfs-uploader directory-terminal: npm install moralis react-moralis.
Stap 5 – Initialisatie van Moralis SDK in React. Na het instellen van uw Moralis-server en het installeren van de Moralis SDK (zie stap 4), is de volgende stap om een verbinding tot stand te brengen tussen onze React-app en onze Moralis-server via de Moralis SDK. Maak een .env bestand in de hoofdmap van uw project en sla uw Moralis-servergegevens hierboven als volgt op: REACT_APP_MORALIS_SERVER_URL=https: REACT_APP_MORALIS_APP_ID=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX. Vervang de tijdelijke aanduidingen door uw eigen Moralis-referenties. Start de server opnieuw op na het updaten van het src/.env bestand. Gebruik de onderstaande sneltoets om uw server te stoppen: ctrl + c. Start uw server opnieuw op met: npm run start. Ten slotte voegen wij in App.js de moralisProvider van react-moralis toe in ons deel.
Stap 6 – Moralis-login maken met Wallet-component. In deze stap creëren wij het inlog-component van onze IPFS-uploader. Moralis ondersteunt het uploaden van openbare bestanden naar IPFS niet, wat betekent dat er een gebruikersportemonnee moet zijn aangesloten voordat
Het is gemeengoed dat mensen denken dat cryptocurrency's en tokens synoniemen zijn. Dit is echter niet het geval, want terwijl sommigen geloven dat de termen uitwisselbaar zijn, zijn...
Read more
