Για αυτό το σεμινάριο, θα σας δείξω πώς να δημιουργήσετε μια εφαρμογή αγοράς χρησιμοποιώντας τα Next.js, Cosmic και Stripe. Αφού τελειώσουμε, θα εφοδιαστείτε με ένα θεμέλιο για να δημιουργήσετε τα δικά σας έργα χρησιμοποιώντας αυτά τα ισχυρά εργαλεία. Ας αρχίσουμε.
Τα χαρακτηριστικά μπόνους περιλαμβάνουν την ανάπτυξη σε Βερκέλ, σκοτεινή και φωτεινή λειτουργία και χρήση Lighthouse για τη μέτρηση της απόδοσης του ιστότοπου μετρήσεις βασικών ζωτικών στοιχείων ιστού, που αυξάνει δραματικά την εμπειρία του χρήστη και ορατότητα ιστότοπου στα αποτελέσματα αναζήτησης SEO (η βαθμολογία Lighthouse αυτής της εφαρμογής εμφανίζεται παρακάτω).
Παιδιά, αν σας αρέσει παρακαλώ upvote in Hunt προϊόν.
- Next.js – επεκτάσιμο και υψηλής απόδοσης React.js πλαίσιο για σύγχρονη ανάπτυξη ιστοσελίδων. Παρέχει ένα μεγάλο σύνολο λειτουργιών, όπως υβριδική απόδοση, προαναφορά διαδρομής, αυτόματη βελτιστοποίηση εικόνας και διεθνοποίηση, εκτός συσκευασίας.
- Κοσμικός – γρήγορο, πλήρως διαχειριζόμενο χωρίς κεφαλή CMS που μας δίνει τη δυνατότητα να διαχειριζόμαστε γρήγορα και να δημιουργούμε περιεχόμενο ιστότοπου, συμπεριλαμβανομένου του UGC (περιεχόμενο που δημιουργείται από χρήστες).
- Ταινία – υποδομή πληρωμών που παρέχει εργαλεία API για τη λήψη εφάπαξ πληρωμών και συνδρομών.
TL? DR
Ελέγξτε τον κωδικό
Δείτε τη ζωντανή επίδειξη
Εγκαταστήστε το πρότυπο εφαρμογής
Πρώτα, πρέπει να παρέχουμε αρχιτεκτονική και σχεδιασμό
Ο σχεδιασμός είναι ουσιαστικά να χωρίζεις πράγματα, με τέτοιο τρόπο ώστε να μπορούν να ενωθούν ξανά. Ο διαχωρισμός των πραγμάτων σε πράγματα που μπορούν να συντεθούν, αυτό είναι το σχέδιο. — Πλούσιος Χίκυ.
MVC σημαίνει σχέδιο σχεδίασης λογισμικού μοντέλου-προβολή-ελεγκτή
Δείτε τι σημαίνει καθένα από αυτά τα συστατικά:
- Μοντέλο: Το backend που περιέχει όλη τη λογική δεδομένων. Κοσμικός Τύποι αντικειμένων (Multiple ή Singleton) μας βοηθούν να δημιουργήσουμε δυναμικές, κλιμακούμενες δομές δεδομένων και η ουσία των μετασχηματισμών τους είναι ανεξάρτητη από τον εξωτερικό κόσμο.
- Προβολή (UI): Η διεπαφή ή η γραφική διεπαφή χρήστη (GUI). Για αυτό, χρησιμοποιούμε το React, το οποίο περιγράφεται ως "V" στρώμα στο MVC.
- ελεγκτής: Οι εγκέφαλοι της εφαρμογής ελέγχουν τον τρόπο εμφάνισης των δεδομένων. Χρησιμοποιούμε το Context API του React για να αποσυνδέσουμε την κατάσταση από την παρουσίαση Δες και διευκολύνουν την επαναχρησιμοποίηση της επιχειρηματικής λογικής.
Το μοτίβο MVC χρησιμοποιείται για σύγχρονες εφαρμογές Ιστού, επειδή επιτρέπει στην εφαρμογή να είναι επεκτάσιμη, συντηρήσιμη και εύκολη στην επέκταση.
Ρύθμιση έργου με το Next.js
Next.js σκοπεύει να βελτιώσει δύο πράγματα: εμπειρίες προγραμματιστών και χρηστών και είναι μια πλήρης εργαλειοθήκη για τη δημιουργία εκπληκτικών γρήγορων εφαρμογών React. Το Next.js προσφέρει μια αφαίρεση που επιλύει τις πιο συνηθισμένες, συνηθισμένες και πολύπλοκες εργασίες όπως η δρομολόγηση, η εσωτερίκευση και η βελτιστοποίηση εικόνας. Από προεπιλογή, το Next.js προκαθορίζει κάθε σελίδα. Αυτό σημαίνει ότι το Next.js δημιουργεί εκ των προτέρων HTML για κάθε σελίδα, αντί να γίνονται όλα με JavaScript από την πλευρά του πελάτη. Η προ-απόδοση μπορεί να οδηγήσει σε καλύτερη απόδοση και SEO.
Το Next.js έχει δύο μορφές προ-απόδοση: Στατική Γενιά (SSG) και Απόδοση από την πλευρά του διακομιστή (SSR).
- Στατική Γενιά είναι η μέθοδος προ-απόδοσης που δημιουργεί το HTML στο χρόνος κατασκευής. Η προ-απόδοση HTML είναι τότε επαναχρησιμοποιηθούν σε κάθε αίτημα.
- Απόδοση από την πλευρά του διακομιστή είναι η μέθοδος προ-απόδοσης που δημιουργεί το HTML on κάθε αίτημα.
Στο έργο μας, χρησιμοποιούμε Απόδοση από την πλευρά του διακομιστή για δυναμικά δεδομένα και σελίδες προαπόδοσης που θα είναι πάντα ενημερωμένες.
Για να ξεκινήσετε, θα δημιουργήσουμε ένα Next.js εφαρμογή που περιλαμβάνει εργαλεία και διαμορφώσεις. Για αυτό το σεμινάριο, θα χρειαστείτε Node.js 12.22.0 ή νεότερη έκδοση. Ανοίξτε το τερματικό, επικολλήστε ή πληκτρολογήστε
npx create-next-app@latest unft-marketplace
# or
yarn create next-app unft-marketplace
Μεταβείτε στον νέο κατάλογο και εγκαταστήστε τις εξαρτήσεις χρησιμοποιώντας έναν διαχειριστή πακέτων όπως npm
, yarn
, ή pnpm
και μετά ξεκινήστε την εφαρμογή στη λειτουργία ανάπτυξης:
cd unft-marketplace
npm install cosmicjs stripe @stripe/stripe-js sass npm run dev
# or
yarn dev
Για να χρησιμοποιήσετε το πρότυπο διεπαφής χρήστη, πρέπει να το κλωνοποιήσετε GitHub. Ανοίξτε το τερματικό, επικολλήστε ή πληκτρολογήστε αυτόν τον κωδικό για να εγκαταστήσετε όλες τις εξαρτήσεις και εκτελέστε τον.
git clone https://github.com/cosmicjs/unft-marketplace
cd unft-marketplace yarn install
yarn dev
Ανοικτό http://localhost:3000 στο πρόγραμμα περιήγησής σας για να δείτε την αρχική σελίδα του ασκητικού.
Διαχείριση κλειδιών/μυστικών API με το Next.js
Όταν εργαζόμαστε με κλειδιά και μυστικά API, πρέπει να φροντίζουμε να τα κρατάμε μυστικά και εκτός ελέγχου έκδοσης, ενώ τα διαθέτουμε εύκολα ως .env
μεταβλητές. Θα χρειαστεί να δημιουργήσετε ένα αρχείο .env στη ρίζα του έργου. Συνδεθείτε στο Κοσμικός και από Bucket Settings > API Access
παίρνει τις ακόλουθες τιμές:
NEXT_PUBLIC_COSMIC_BUCKET_SLUG=your_cosmic_slug
NEXT_PUBLIC_COSMIC_READ_KEY=your_cosmic_read_key
COSMIC_WRITE_KEY=your_cosmic_write_key NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=your_stripe_key
STRIPE_SECRET_KEY=your_stripe_secret_key
Η NEXT_PUBLIC_
Το πρόθεμα εκθέτει αυτόματα αυτήν τη μεταβλητή στο πρόγραμμα περιήγησης. Το Next.js θα εισαγάγει την τιμή για αυτά στον πηγαίο κώδικα με δυνατότητα δημόσιας προβολής κατά το χρόνο δημιουργίας/απόδοσης. Επομένως, βεβαιωθείτε ότι δεν χρησιμοποιείτε αυτό το πρόθεμα για μυστικές τιμές! Με τον ίδιο τρόπο συνδεθείτε Ταινία και για προγραμματιστές τμήμα πάρτε τα κλειδιά σας.
Διαδρομές API Next.js
Next.js Διαδρομές API για να δημιουργήσετε τελικά σημεία API μέσα στην εφαρμογή Next.js. Θα αναπτυχθούν ως Λειτουργίες χωρίς διακομιστή (Επίσης γνωστή ως Λάμδας). Στην περίπτωσή μας, για το φιλτράρισμα του Κοσμικού περιεχομένου κατά παραμέτρους θα δημιουργήσουμε ένα αρχείο που ονομάζεται filter.js
in pages/api
κατάλογο που έχει την ακόλουθη μορφή:
import Cosmic from 'cosmicjs'; const bucket = Cosmic().bucket({ slug: '', read_key: '',
} ) export default async function filterHandler(req, res) { const { query: {min, max, color, category, search} } = req; let queryParam = {}; if(typeof min !== 'undefined' || typeof max !== 'undefined') { queryParam = { ...queryParam, "metadata.price": {"$gte": typeof min !== 'undefined' ? Number(min) : 1, "$lte": typeof max !== 'undefined' ? Number(max) : 1000000000 },} } if(typeof color !== 'undefined') { queryParam = { ...queryParam, "metadata.color": color,} } if(typeof category !== 'undefined') { queryParam = { ...queryParam, "metadata.categories": category,} } if(typeof search !== 'undefined') { queryParam = { ...queryParam, "title": { "$regex": search, "$options": "i" },} } const params = { query: { ...queryParam, type: 'products', }, props: 'title,slug,metadata,created_at', } try { const data = await bucket.getObjects(params); res.status(200).json(data); } catch (error) { res.status(404).json(error); }
}
Σημειώστε ότι:
Επισκόπηση και ενοποίηση κοσμικών χαρακτηριστικών
Κοσμικός είναι ένα εξαιρετικό CMS χωρίς κεφάλι που μας δίνει τη δυνατότητα να μοντελοποιούμε, να διαχειριζόμαστε και να αποθηκεύουμε το περιεχόμενο και τα πολυμέσα μας σε έναν βολικό φιλοξενούμενο πίνακα εργαλείων και, στη συνέχεια, να ανακτούμε το περιεχόμενό μας χρησιμοποιώντας διαθέσιμα εργαλεία API. Το API παρέχει δυνατότητες αναζήτησης και φιλτραρίσματος από το κουτί, γεγονός που καθιστά εύκολη τη δημιουργία λειτουργιών αναζήτησης και φιλτραρίσματος στην εφαρμογή μας. Το Cosmic παρέχει πλήρη σύγχρονη λειτουργικότητα και δυνατότητες για τη δημιουργία διαδραστικών, ανεξάρτητων και δυναμικών ιστοσελίδων.
Προσαρμόσιμο API – Δημιουργήστε το σχήμα, τα μοντέλα και τους ελεγκτές για το API από τον πίνακα ελέγχου διαχειριστή. Το Cosmic προσφέρει και τα δύο α REST και GraphQL API για τη διευκόλυνσή μας.
webhooks – Καλέστε ξανά οπουδήποτε χρειάζεστε, για να έχετε τη λειτουργικότητα που θέλετε, εκτός συσκευασίας.
Ερωτήματα – σας επιτρέπει να βρείτε το σωστό στοιχείο με τα δεδομένα σας από αναζήτηση, φιλτράρισμα και ταξινόμηση. Μπορείτε να χρησιμοποιήσετε μερικά προχωρημένα ερωτήματα για να δημιουργήσετε πιο αναλυτικές δυνατότητες αναζήτησης.i
Προσθήκη πολυμέσων και αντικειμένου – Μπορείτε να ενεργοποιήσετε το περιεχόμενο που δημιουργείται από χρήστες στην εφαρμογή σας χρησιμοποιώντας το Cosmic API. Οι χρήστες μπορούν να ανεβάσουν και να δημιουργήσουν διαδραστικό περιεχόμενο στα καθορισμένα μοντέλα δεδομένων σας. Το Cosmic δεν είναι μόνο ένα πλήρως διαχειριζόμενο σύστημα διαχείρισης περιεχομένου, αλλά το API μπορεί επίσης να χρησιμοποιηθεί για τη δημιουργία εμπειριών περιεχομένου που δημιουργούνται από τους χρήστες.
Ξεκινώντας με το Cosmic
Το πρώτο βήμα είναι η δημιουργία ενός δωρεάν λογαριασμός Cosmic σε Cosmic Dashboard και ένα νέο έργο. Ας επιλέξουμε την επιλογή «Έναρξη από την αρχή».
Κοσμικός Τύποι αντικειμένων (Multiple ή Singleton) βοηθήστε μας να δημιουργήσουμε δυναμικές, επεκτάσιμες, επαναχρησιμοποιήσιμες δομές δεδομένων και το μοντέλο περιεχομένου μας. Η δημιουργία τμημάτων μοντέλων, εύκολη από την αρχή, ορίζει τα «μεταπεδία» στο «Μοντέλο περιεχομένου». Για ένα επαναχρησιμοποιήσιμο μοντέλο που χρησιμοποιείται σε πολλά αντικείμενα επιλέξτε Τύπος πολλαπλών αντικειμένων. Για το έργο μας, θα δημιουργήσουμε ένα επαναχρησιμοποιήσιμο Προϊόντα Τύπος αντικειμένου μοντέλο χρησιμοποιώντας Πολλαπλούς Σχέσεις αντικειμένου με Κατηγορίες. Αυτό θα μας επιτρέψει να προσθέσουμε ή να αφαιρέσουμε Προϊόντα προς την Κατηγορίες και ενεργοποιήστε την αναζήτηση και το φιλτράρισμα ανά κατηγορία.
Αφού δημιουργήσετε το μοντέλο περιεχομένου για τα Προϊόντα μας, μπορείτε να αρχίσετε να προσθέτετε Προϊόντα από τον πίνακα ελέγχου ως εξής:
Μπορείτε να ορίσετε άλλα μοντέλα περιεχομένου δημιουργώντας τύπους αντικειμένων ακολουθώντας αυτήν τη σχεδίαση σχήματος:
- Singleton για ένα μοναδικό μοντέλο,
- Πολλαπλές για επαναχρησιμοποιήσιμα μοντέλα.
Χρησιμοποιώντας το Cosmic ερωτήματα, μπορείτε να βρείτε γρήγορα το συγκεκριμένο περιεχόμενο σύμφωνα με αναζήτηση, φιλτράρισμα και ταξινόμηση κριτήρια.
Το περιεχόμενο που δημιουργείται από τον χρήστη
Χρησιμοποιώντας τις Κοσμικές δυνατότητες για να Προσθήκη πολυμέσων και αντικειμένων, Οι συνδεδεμένοι χρήστες μπορούν να ανεβάσουν και να δημιουργήσουν το δικό τους περιεχόμενο που υποβάλλεται από τη φόρμα. Για την περίπτωση χρήσης μας, ο χρήστης μπορεί να δημιουργήσει νέα Προϊόντα να προστεθεί στην αγορά προς πώληση.
Η μεταφόρτωση αρχείων και δυναμικού περιεχομένου στο Next.js απαιτεί διαδρομές API καθώς θα χρειαστεί να αποθηκεύσουμε μυστικά κλειδιά με ασφάλεια σε μεταβλητές περιβάλλοντος από την πλευρά του διακομιστή. Ακολουθεί μια σύντομη επισκόπηση του τρόπου αποστολής αρχείων με το React και Διαδρομές API Next.js χρησιμοποιώντας formidable
, fs
, και το Κοσμικός bucket.addMedia
μέθοδος.
import Cosmic from 'cosmicjs';
import formidable from 'formidable';
import fs from "fs"; const bucket = Cosmic().bucket({ slug: process.env.NEXT_PUBLIC_COSMIC_BUCKET_SLUG, read_key: process.env.NEXT_PUBLIC_COSMIC_READ_KEY, write_key: process.env.COSMIC_WRITE_KEY,
}); export const config = { api: { bodyParser: false, },
}; export default async function uploadHandler( req,res ) { const form = new formidable.IncomingForm({ multiple: false }); try { form.parse( req, async ( err, fields, files ) => { if (err) return reject(err); const cosmicRes = await saveFile(files.file); res.status( 200 ).json(cosmicRes); } ); } catch (error) { res.status(404).json(error.message) }
} const saveFile = async ( file ) => { const filedata = fs.readFileSync( file?.filepath ); const media_object = { originalname: file.originalFilename, buffer: filedata }; try { const cosmic_res = await bucket.addMedia({ media: media_object } ); await fs.unlinkSync(file?.filepath); return cosmic_res; } catch (error) { console.log(error); return; }
};
Επισκόπηση και ενσωμάτωση λωρίδων
Ταινία παρέχει έναν τρόπο καταγραφής πληρωμών στην εφαρμογή σας. Όπως και η Cosmic έχει κάνει όλη τη βαρύτητα για την υποδομή περιεχομένου, το Stripe παρέχει την υποδομή ηλεκτρονικού εμπορίου και τα εργαλεία για να δημιουργήσετε ευχάριστες εμπειρίες πληρωμής για τους πελάτες σας, ανεξάρτητα από την υπηρεσία ή το προϊόν που πωλείται.
Εξαιτίας της μεγάλης Απαιτήσεις συμμόρφωσης PCI, η βιβλιοθήκη Stripe.js πρέπει να φορτωθεί από τους διακομιστές του Stripe. Αυτό δημιουργεί μια πρόκληση όταν εργάζεστε με εφαρμογές που έχουν αποδοθεί από την πλευρά του διακομιστή, καθώς το αντικείμενο παραθύρου δεν είναι διαθέσιμο στον διακομιστή. Για να μας βοηθήσει να διαχειριστούμε αυτήν την πολυπλοκότητα, το Stripe παρέχει ένα περιτύλιγμα φόρτωσης που επιτρέπει την εισαγωγή του Stripe.js σαν λειτουργική μονάδα ES:
import { loadStripe } from '@stripe/stripe-js'; let stripePromise; const getStripe = () => { if(!stripePromise) { stripePromise = loadStripe(process.env.NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY); } return stripePromise;
} export default getStripe;
Το Stripe.js φορτώνεται ως παρενέργεια του import '@stripe/stripe-js'
δήλωση.
Δημιουργήστε την περίοδο ολοκλήρωσης αγοράς Stripe
Προσθέστε ένα τελικό σημείο στον διακομιστή σας που δημιουργεί ένα Συνεδρία ολοκλήρωσης αγοράς. Η περίοδος ολοκλήρωσης αγοράς ελέγχει τι βλέπει ο πελάτης σας στη σελίδα πληρωμής, όπως στοιχεία γραμμής, το ποσό της παραγγελίας και το νόμισμα και τους αποδεκτούς τρόπους πληρωμής. Επίσης, μπορείτε να ενεργοποιήσετε ή να απενεργοποιήσετε τους τρόπους πληρωμής απευθείας στο Ταμπλό λωρίδων.
import Stripe from 'stripe'; const stripe = new Stripe( process.env.STRIPE_SECRET_KEY ); export default async function handler(req, res) { if (req.method === 'POST') { try { const params = { submit_type: 'pay', mode: 'payment', payment_method_types: ['card'], billing_address_collection: 'auto', shipping_options: [ { shipping_rate: 'shr_1L4pafH6oGDppJjV9MrYC7z0' }, { shipping_rate: 'shr_1L4pn4H6oGDppJjVBL7vPTk1' }, ], line_items: req.body.map((item) => { const img = item.metadata.image.imgix_url; return { price_data: { currency: 'usd', product_data: { name: item.title, images: [img], }, unit_amount: item.metadata.price * 100, }, adjustable_quantity: { enabled:true, minimum: 1, }, quantity: item.quantity } }), success_url: `${req.headers.origin}/`, cancel_url: `${req.headers.origin}/`, } const session = await stripe.checkout.sessions.create(params); res.status(200).json(session); } catch (err) { res.status(err.statusCode || 500).json(err.message); } } else { res.setHeader('Allow', 'POST'); res.status(405).end('Method Not Allowed'); }
}
Τα επόμενα βήματα
Αν και αυτή η εφαρμογή αγοράς είναι κυρίως μια απόδειξη της ιδέας για να μάθετε για αυτές τις σύγχρονες λύσεις, είναι μια καλή αρχή για να αξιοποιήσετε. Υπάρχει δυνατότητα προσθήκης νέων δυνατοτήτων όπως:
- Σελίδα λογαριασμού χρήστη για εμφάνιση παραγγελιών
- Σελίδα προφίλ χρήστη για προβολή jpeg που αγοράσατε
- Σύστημα σχολίων για τη λήψη κριτικών και συνομιλιών
- Επιλογή Bitcoin / Lightning για την πραγματοποίηση αγορών
Συμπέρασμα
Ελπίζω να σας άρεσε αυτό το σεμινάριο εξερευνώντας πώς να χρησιμοποιείτε πανίσχυρα εργαλεία API-first για τη δημιουργία μιας εφαρμογής αγοράς με πλήρη χαρακτηριστικά. Αυτή η δυναμική, λειτουργική, προσαρμόσιμη και πλήρως ενσωματωμένη αγορά uNFT, που υποστηρίζεται από Next.js, Cosmic και Stripe μπορεί να προσαρμοστεί και για άλλους τύπους επιχειρήσεων. Μη διστάσετε να πιρούνι τον κωδικό, και χρησιμοποιήστε το όπως προτιμάτε!
- SEO Powered Content & PR Distribution. Ενισχύστε σήμερα.
- Platoblockchain. Web3 Metaverse Intelligence. Ενισχύθηκε η γνώση. Πρόσβαση εδώ.
- πηγή: https://www.codementor.io/nairage/build-an-unft-marketplace-with-next-js-cosmic-and-stripe-integration-1v892i89x2
- a
- Σχετικά
- αποδεκτό
- Σύμφωνα με
- Λογαριασμός
- απέναντι
- διαχειριστής
- Μετά το
- Όλα
- επιτρέπει
- πάντοτε
- ποσό
- και
- οπουδήποτε
- χώρια
- api
- app
- Εφαρμογή
- εφαρμογές
- εφαρμογές
- αρχιτεκτονική
- προσόν
- αυτόματη
- Αυτόματο
- αυτομάτως
- διαθέσιμος
- πίσω
- Backend
- επειδή
- είναι
- παρακάτω
- Καλύτερα
- ΛΑΜΠΑΝΤΙΚΟ
- σώμα
- Κουτί
- πρόγραμμα περιήγησης
- χτίζω
- Κτίριο
- επιχείρηση
- επιχειρήσεις
- αγορά
- κλήση
- δυνατότητες
- πιάνω
- κάρτα
- περίπτωση
- κατηγορίες
- κατηγορία
- CD
- πρόκληση
- Ολοκλήρωση Αγοράς
- Επιλέξτε
- εκατοστά
- κωδικός
- χρώμα
- Κοινός
- πλήρης
- συγκρότημα
- περίπλοκο
- Συμμόρφωση
- εξαρτήματα
- συγκείμενο
- έννοια
- συμπέρασμα
- Περιέχει
- περιεχόμενο
- συμφραζόμενα
- έλεγχος
- ελέγχους
- ευκολία
- Βολικός
- δημιουργία
- δημιουργεί
- δημιουργία
- κριτήρια
- Νόμισμα
- πελάτης
- Πελάτες
- προσαρμόσιμη
- σκοτάδι
- ταμπλό
- ημερομηνία
- Προεπιλογή
- Ορίζει
- γοητευτικός
- αναπτυχθεί
- ανάπτυξη
- περιγράφεται
- Υπηρεσίες
- Dev
- Ανάπτυξη
- κατευθείαν
- Display
- δραματικά
- δυναμικός
- κάθε
- ηλεκτρονικού εμπορίου
- αποτέλεσμα
- ενεργοποιήσετε
- δίνει τη δυνατότητα
- Τελικό σημείο
- Περιβάλλον
- εξοπλισμένο
- σφάλμα
- ουσία
- Ανάπτυξη
- εμπειρία
- Δραστηριοτητες
- Εξερευνώντας
- διευκολύνω
- FAST
- Χαρακτηριστικά
- Πεδία
- Αρχεία
- Αρχεία
- φιλτράρισμα
- φιλτράρισμα
- Εύρεση
- Όνομα
- Εξής
- μορφή
- μορφή
- θαυμάσιος
- μορφές
- Θεμέλιο
- Πλαίσιο
- Δωρεάν
- από
- frontend
- FS
- πλήρη
- πλήρως
- λειτουργικός
- λειτουργικότητα
- θεμελιωδώς
- παράγεται
- δημιουργεί
- παίρνω
- να πάρει
- gif
- καλός
- εξαιρετική
- που έχει
- κεφαλίδες
- βοήθεια
- εδώ
- υψηλή απόδοση
- Αρχική
- ελπίζω
- φιλοξενείται
- Πως
- Πώς να
- HTML
- HTTPS
- Υβριδικό
- εικόνα
- εισαγωγή
- βελτίωση
- in
- περιλαμβάνουν
- περιλαμβάνει
- Συμπεριλαμβανομένου
- Αυξήσεις
- ανεξάρτητος
- Υποδομή
- εγκαθιστώ
- αντί
- ενσωματωθεί
- ολοκλήρωση
- διαδραστικό
- περιβάλλον λειτουργίας
- ανεξάρτητος
- IT
- αντικειμένων
- το JavaScript
- Διατήρηση
- πλήκτρα
- γνωστός
- large
- στρώμα
- ΜΑΘΑΊΝΩ
- Βιβλιοθήκη
- ανύψωση
- φως
- αστραπή
- γραμμή
- ζω
- Διατηρήσιμο
- κάνω
- ΚΑΝΕΙ
- Κατασκευή
- διαχείριση
- διαχειρίζεται
- διαχείριση
- διευθυντής
- διαχείριση
- αγορά
- max
- μέσα
- μέτρο
- Εικόνες / Βίντεο
- μήνυμα
- Μεταδεδομένα
- μέθοδος
- μέθοδοι
- Τρόπος
- μοντέλο
- μοντέλα
- ΜΟΝΤΕΡΝΑ
- ενότητα
- περισσότερο
- πλέον
- πολλαπλούς
- Ανάγκη
- Νέα
- Νέες δυνατότητες
- επόμενη
- Next.js
- αντικείμενο
- αντικειμένων
- προσφορές
- ανοίξτε
- βελτιστοποίηση
- Επιλογή
- τάξη
- ΑΛΛΑ
- επισκόπηση
- δική
- πακέτο
- παράμετροι
- πρότυπο
- Πληρωμή
- πληρωμή
- μέθοδοι πληρωμής
- πληρωμές
- επίδοση
- Πλάτων
- Πληροφορία δεδομένων Plato
- Πλάτωνα δεδομένα
- σας παρακαλούμε
- Θέση
- δυναμικού
- τροφοδοτείται
- ισχυρός
- παρουσίαση
- τιμή
- διαδικασια μας
- Προϊόν
- Προϊόντα
- Προφίλ ⬇️
- σχέδιο
- έργα
- απόδειξη
- απόδειξη της έννοιας
- παρέχουν
- παρέχει
- δημοσίως
- αγοράσει
- βάζω
- ποσότητα
- γρήγορα
- Αντίδραση
- λαμβάνω
- Σχέσεις
- αφαιρέστε
- απόδοση
- ζητήσει
- Απαιτεί
- αποτέλεσμα
- Αποτελέσματα
- επαναχρησιμοποιήσιμη
- Κριτικές
- ρίζα
- Διαδρομή
- δρομολόγια
- τρέξιμο
- πώληση
- ίδιο
- Sass
- επεκτάσιμη
- Αναζήτηση
- αναζήτηση
- Μυστικό
- Τμήμα
- τμήματα
- ασφαλώς
- βλέπει
- SEO
- διαχωρίζοντας
- υπηρεσία
- Συνεδρίαση
- συνεδρίες
- σειρά
- Σέτς
- τον καθορισμό
- ρυθμίσεις
- δείχνουν
- λογισμικό
- πωλούνται
- Λύσεις
- Λύει
- μερικοί
- Πηγή
- πρωτογενής κώδικας
- συγκεκριμένες
- στέκεται
- Εκκίνηση
- ξεκίνησε
- Κατάσταση
- Δήλωση
- Βήμα
- κατάστημα
- ρίγα
- συνδρομή
- τέτοιος
- σύστημα
- Πάρτε
- παίρνει
- λήψη
- εργασίες
- πρότυπο
- τερματικό
- Η
- Το κράτος
- τους
- επομένως
- πράγματα
- ώρα
- Τίτλος
- προς την
- μαζι
- εργαλειοθήκη
- εργαλεία
- μετασχηματισμούς
- φροντιστήριο
- τύποι
- ui
- μοναδικός
- up-to-ημερομηνία
- us
- USD
- χρήση
- περίπτωση χρήσης
- Χρήστες
- Διεπαφής χρήστη
- Χρήστες
- αξία
- Αξίες
- εκδοχή
- ιστός
- εφαρμογές ιστού
- Web ανάπτυξη
- Ιστοσελίδα : www.example.gr
- Τι
- Ποιό
- ενώ
- Wikipedia
- θα
- εντός
- εργαζόμενος
- κόσμος
- Σας
- zephyrnet