Jump to content
modifiedcontent

Ideas and best practices to secure a member registration system

Recommended Posts

I have my own register-login-profile/account page system. I know that Ryan recently released an official module for this, but there may be an advantage to having my own custom solution. Anyway, it seems to work well.

But, I have been getting annoying Russian hack attempt accounts, mostly as 'guests' that don't bother to use the activation link.

Most if not all of these accounts have this in the name field:

No Subscription Detected
Not Recognized

...which makes them relatively easy to filter out from real name accounts.

Where do these "strings" come from? I can't find them in Processwire's source. Are the hackers using some kind of tool that inserts these for some reason? Or is it a PHP thing? Does anyone recognize them? Does it mean they are using some kind of backdoor instead of the registration form?

In general, what are the best practices to secure my registration form, prevent spam accounts, etc.?

I'll start with adding a check to block IP addresses that try to register with 'Not Recognized' etc. in the name field I guess.

 

 

Share this post


Link to post
Share on other sites

User agent blocking may help. From Perishable Press:

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTP_USER_AGENT} ^$|\<|\>|\'|\%|\_iRc|\_Works|\@\$x|\<\?|\$x0e|\+select\+|\+union\+|1\,\1\,1\,|2icommerce|3GSE|4all|59\.64\.153\.|88\.0\.106\.|98|85\.17\.|A\_Browser|ABAC|Abont|abot|Accept|Access|Accoo|AceFTP|Acme|ActiveTouristBot|Address|Adopt|adress|adressendeutschland|ADSARobot|agent|ah\-ha|Ahead|AESOP\_com\_SpiderMan|aipbot|Alarm|Albert|Alek|Alexibot|Alligator|AllSubmitter|alma|almaden|ALot|Alpha|aktuelles|Akregat|Amfi|amzn\_assoc|Anal|Anarchie|andit|Anon|AnotherBot|Ansearch|AnswerBus|antivirx|Apexoo|appie|Aqua_Products|Arachmo|archive|arian|ASPSe|ASSORT|aster|Atari|ATHENS|AtHome|Atlocal|Atomic_Email_Hunter|Atomz|Atrop|^attach|attrib|autoemailspider|autohttp|axod|batch|b2w|Back|BackDoorBot|BackStreet|BackWeb|Badass|Baid|Bali|Bandit|Baidu|Barry|BasicHTTP|BatchFTP|bdfetch|beat|Become|Beij|BenchMark|berts|bew|big.brother|Bigfoot|Bilgi|Bison|Bitacle|Biz360|Black|Black.Hole|BlackWidow|bladder.fusion|Blaiz|Blog.Checker|Blogl|BlogPeople|Blogshares.Spiders|Bloodhound|Blow|bmclient|Board|BOI|boitho|Bond|Bookmark.search.tool|boris|Bost|Boston.Project|BotRightHere|Bot.mailto:craftbot@yahoo.com|BotALot|botpaidtoclick|botw|brandwatch|BravoBrian|Brok|Bropwers|Broth|browseabit|BrowseX|Browsezilla|Bruin|bsalsa|Buddy|Build|Built|Bulls|bumblebee|Bunny|Busca|Busi|Buy|bwh3|c\-spider|CafeK|Cafi|camel|Cand|captu|Catch|cd34|Ceg|CFNetwork|cgichk|Cha0s|Chang|chaos|Char|char\(32\,35\)|charlotte|CheeseBot|Chek|CherryPicker|chill|ChinaClaw|CICC|Cisco|Cita|Clam|Claw|Click.Bot|clipping|clshttp|Clush|COAST|ColdFusion|Coll|Comb|commentreader|Compan|contact|Control|contype|Conc|Conv|Copernic|Copi|Copy|Coral|Corn|core-project|cosmos|costa|cr4nk|crank|craft|Crap|Crawler0|Crazy|Cres|cs\-CZ|cuill|Curl|Custo|Cute|CSHttp|Cyber|cyberalert|^DA$|daoBot|DARK|Data|Daten|Daum|dcbot|dcs|Deep|DepS|Detect|Deweb|Diam|Digger|Digimarc|digout4uagent|DIIbot|Dillo|Ding|DISC|discobot|Disp|Ditto|DLC|DnloadMage|DotBot|Doubanbot|Download|Download.Demon|Download.Devil|Download.Wonder|Downloader|drag|DreamPassport|Drec|Drip|dsdl|dsok|DSurf|DTAAgent|DTS|Dual|dumb|DynaWeb|e\-collector|eag|earn|EARTHCOM|EasyDL|ebin|EBM-APPLE|EBrowse|eCatch|echo|ecollector|Edco|edgeio|efp\@gmx\.net|EirGrabber|email|Email.Extractor|EmailCollector|EmailSearch|EmailSiphon|EmailWolf|Emer|empas|Enfi|Enhan|Enterprise\_Search|envolk|erck|EroCr|ESurf|Eval|Evil|Evere|EWH|Exabot|Exact|EXPLOITER|Expre|Extra|ExtractorPro|EyeN|FairAd|Fake|FANG|FAST|fastlwspider|FavOrg|Favorites.Sweeper|Faxo|FDM\_1|FDSE|fetch|FEZhead|Filan|FileHound|find|Firebat|Firefox.2\.0|Firs|Flam|Flash|FlickBot|Flip|fluffy|flunky|focus|Foob|Fooky|Forex|Forum|ForV|Fost|Foto|Foun|Franklin.Locator|freefind|FreshDownload|FrontPage|FSurf|Fuck|Fuer|futile|Fyber|Gais|GalaxyBot|Galbot|Gamespy\_Arcade|GbPl|Gener|geni|Geona|Get|gigabaz|Gira|Ginxbot|gluc|glx.?v|gnome|Go.Zilla|Goldfire|Google.Wireless.Transcoder|Googlebot\-Image|Got\-It|GOFORIT|gonzo|GornKer|GoSearch|^gotit$|gozilla|grab|Grabber|GrabNet|Grub|Grup|Graf|Green.Research|grub|grub\-client|gsa\-cra|GSearch|GT\:\:WWW|GuideBot|guruji|gvfs|Gyps|hack|haha|hailo|Harv|Hatena|Hax|Head|Helm|herit|hgre|hhjhj\@yahoo|Hippo|hloader|HMView|holm|holy|HomePageSearch|HooWWWer|HouxouCrawler|HMSE|HPPrint|htdig|HTTPConnect|httpdown|http.generic|HTTPGet|httplib|HTTPRetriever|HTTrack|human|Huron|hverify|Hybrid|Hyper|ia\_archiver|iaskspi|IBM\_Planetwide|iCCra|ichiro|ID\-Search|IDA|IDBot|IEAuto|IEMPT|iexplore\.exe|iGetter|Ilse|Iltrov|Image|Image.Stripper|Image.Sucker|imagefetch|iimds\_monitor|Incutio|IncyWincy|Indexer|Industry.Program|Indy|InetURL|informant|InfoNav|InfoTekies|Ingelin|Innerpr|Inspect|InstallShield.DigitalWizard|Insuran\.|Intellig|Intelliseek|InterGET|Internet.Ninja|Internet.x|Internet\_Explorer|InternetLinkagent|InternetSeer.com|Intraf|IP2|Ipsel|Iria|IRLbot|Iron33|Irvine|ISC\_Sys|iSilo|ISRCCrawler|ISSpi|IUPUI.Research.Bot|Jady|Jaka|Jam|^Java|java\/|Java\(tm\)|JBH.agent|Jenny|JetB|JetC|jeteye|jiro|JoBo|JOC|jupit|Just|Jyx|Kapere|kash|Kazo|KBee|Kenjin|Kernel|Keywo|KFSW|KKma|Know|kosmix|KRAE|KRetrieve|Krug|ksibot|ksoap|Kum|KWebGet|Lachesis|lanshan|Lapo|larbin|leacher|leech|LeechFTP|LeechGet|leipzig\.de|Lets|Lexi|lftp|Libby|libcrawl|libcurl|libfetch|libghttp|libWeb|libwhisker|libwww|libwww\-FM|libwww\-perl|LightningDownload|likse|Linc|Link|Link.Sleuth|LinkextractorPro|Linkie|LINKS.ARoMATIZED|LinkScan|linktiger|LinkWalker|Lint|List|lmcrawler|LMQ|LNSpiderguy|loader|LocalcomBot|Locu|London|lone|looksmart|loop|Lork|LTH\_|lwp\-request|LWP|lwp-request|lwp-trivial|Mac.Finder|Macintosh\;.I\;.PPC|Mac\_F|magi|Mag\-Net|Magnet|Magp|Mail.Sweeper|main|majest|Mam|Mana|MarcoPolo|mark.blonin|MarkWatch|MaSagool|Mass|Mass.Downloader|Mata|mavi|McBot|Mecha|MCspider|mediapartners|^Memo|MEGAUPLOAD|MetaProducts.Download.Express|Metaspin|Mete|Microsoft.Data.Access|Microsoft.URL|Microsoft\_Internet\_Explorer|MIDo|MIIx|miner|Mira|MIRE|Mirror|Miss|Missauga|Missigua.Locator|Missouri.College.Browse|Mist|Mizz|MJ12|mkdb|mlbot|MLM|MMMoCrawl|MnoG|moge|Moje|Monster|Monza.Browser|Mooz|Moreoverbot|MOT\-MPx220|mothra\/netscan|mouse|MovableType|Mozdex|Mozi\!|^Mozilla$|Mozilla\/1\.22|Mozilla\/22|^Mozilla\/3\.0.\(compatible|Mozilla\/3\.Mozilla\/2\.01|Mozilla\/4\.0\(compatible|Mozilla\/4\.08|Mozilla\/4\.61.\(Macintosh|Mozilla\/5\.0|Mozilla\/7\.0|Mozilla\/8|Mozilla\/9|Mozilla\:|Mozilla\/Firefox|^Mozilla.*Indy|^Mozilla.*NEWT|^Mozilla*MSIECrawler|Mp3Bot|MPF|MRA|MS.FrontPage|MS.?Search|MSFrontPage|MSIE\_6\.0|MSIE6|MSIECrawler|msnbot\-media|msnbot\-Products|MSNPTC|MSProxy|MSRBOT|multithreaddb|musc|MVAC|MWM|My\_age|MyApp|MyDog|MyEng|MyFamilyBot|MyGetRight|MyIE2|mysearch|myurl|NAG|NAMEPROTECT|NASA.Search|nationaldirectory|Naver|Navr|Near|NetAnts|netattache|Netcach|NetCarta|Netcraft|NetCrawl|NetMech|netprospector|NetResearchServer|NetSp|Net.Vampire|netX|NetZ|Neut|newLISP|NewsGatorInbox|NEWT|NEWT.ActiveX|Next|^NG|NICE|nikto|Nimb|Ninja|Ninte|NIPGCrawler|Noga|nogo|Noko|Nomad|Norb|noxtrumbot|NPbot|NuSe|Nutch|Nutex|NWSp|Obje|Ocel|Octo|ODI3|oegp|Offline|Offline.Explorer|Offline.Navigator|OK.Mozilla|omg|Omni|Onfo|onyx|OpaL|OpenBot|Openf|OpenTextSiteCrawler|OpenU|Orac|OrangeBot|Orbit|Oreg|osis|Outf|Owl|P3P|PackRat|PageGrabber|PagmIEDownload|pansci|Papa|Pars|Patw|pavu|Pb2Pb|pcBrow|PEAR|PEER|PECL|pepe|Perl|PerMan|PersonaPilot|Persuader|petit|PHP|PHP.vers|PHPot|Phras|PicaLo|Piff|Pige|pigs|^Ping|Pingd|PingALink|Pipe|Plag|Plant|playstarmusic|Pluck|Pockey|POE\-Com|Poirot|Pomp|Port.Huron|Post|powerset|Preload|press|Privoxy|Probe|Program.Shareware|Progressive.Download|ProPowerBot|prospector|Provider.Protocol.Discover|ProWebWalker|Prowl|Proxy|Prozilla|psbot|PSurf|psycheclone|^puf$|Pulse|Pump|PushSite|PussyCat|PuxaRapido|PycURL|Pyth|PyQ|QuepasaCreep|Query|Quest|QRVA|Qweer|radian|Radiation|Rambler|RAMP|RealDownload|Reap|Recorder|RedCarpet|RedKernel|ReGet|relevantnoise|replacer|Repo|requ|Rese|Retrieve|Rip|Rix|RMA|Roboz|Rogue|Rover|RPT\-HTTP|Rsync|RTG30|.ru\)|ruby|Rufus|Salt|Sample|SAPO|Sauger|savvy|SBIder|SBP|SCAgent|scan|SCEJ\_|Sched|Schizo|Schlong|Schmo|Scout|Scooter|Scorp|ScoutOut|SCrawl|screen|script|SearchExpress|searchhippo|Searchme|searchpreview|searchterms|Second.Street.Research|Security.Kol|Seekbot|Seeker|Sega|Sensis|Sept|Serious|Sezn|Shai|Share|Sharp|Shaz|shell|shelo|Sherl|Shim|Shiretoko|ShopWiki|SickleBot|Simple|Siph|sitecheck|SiteCrawler|SiteSnagger|Site.Sniper|SiteSucker|sitevigil|SiteX|Sleip|Slide|Slurpy.Verifier|Sly|Smag|SmartDownload|Smurf|sna\-|snag|Snake|Snapbot|Snip|Snoop|So\-net|SocSci|sogou|Sohu|solr|sootle|Soso|SpaceBison|Spad|Span|spanner|Speed|Spegla|Sphere|Sphider|spider|SpiderBot|SpiderEngine|SpiderView|Spin|sproose|Spurl|Spyder|Squi|SQ.Webscanner|sqwid|Sqworm|SSM\_Ag|Stack|Stamina|stamp|Stanford|Statbot|State|Steel|Strateg|Stress|Strip|studybot|Style|subot|Suck|Sume|sun4m|Sunrise|SuperBot|SuperBro|Supervi|Surf4Me|SuperHTTP|Surfbot|SurfWalker|Susi|suza|suzu|Sweep|sygol|syncrisis|Systems|Szukacz|Tagger|Tagyu|tAke|Talkro|TALWinHttpClient|tamu|Tandem|Tarantula|tarspider|tBot|TCF|Tcs\/1|TeamSoft|Tecomi|Teleport|Telesoft|Templeton|Tencent|Terrawiz|Test|TexNut|trivial|Turnitin|The.Intraformant|TheNomad|Thomas|TightTwatBot|Timely|Titan|TMCrawler|TMhtload|toCrawl|Todobr|Tongco|topic|Torrent|Track|translate|Traveler|TREEVIEW|True|Tunnel|turing|Turnitin|TutorGig|TV33\_Mercator|Twat|Tweak|Twice|Twisted.PageGetter|Tygo|ubee|UCmore|UdmSearch|UIowaCrawler|Ultraseek|UMBC|unf|UniversalFeedParser|unknown|UPG1|UtilMind|URLBase|URL.Control|URL\_Spider\_Pro|urldispatcher|URLGetFile|urllib|URLSpiderPro|URLy|User\-Agent|UserAgent|USyd|Vacuum|vagabo|Valet|Valid|Vamp|vayala|VB\_|VCI|VERI\~LI|verif|versus|via|Viewer|virtual|visibilitygap|Visual|vobsub|Void|VoilaBot|voyager|vspider|VSyn|w\:PACBHO60|w0000t|W3C|w3m|w3search|walhello|Walker|Wand|WAOL|WAPT|Watch|Wavefire|wbdbot|Weather|web.by.mail|Web.Data.Extractor|Web.Downloader|Web.Ima|Web.Mole|Web.Sucker|Web2Mal|Web2WAP|WebaltBot|WebAuto|WebBandit|Webbot|WebCapture|WebCat|webcraft\@bea|Webclip|webcollage|WebCollector|WebCopier|WebCopy|WebCor|webcrawl|WebDat|WebDav|webdevil|webdownloader|Webdup|WebEMail|WebEMailExtrac|WebEnhancer|WebFetch|WebGo|WebHook|Webinator|WebInd|webitpr|WebFilter|WebFountain|WebLea|Webmaster|WebmasterWorldForumBot|WebMin|WebMirror|webmole|webpic|WebPin|WebPix|WebReaper|WebRipper|WebRobot|WebSauger|WebSite|Website.eXtractor|Website.Quester|WebSnake|webspider|Webster|WebStripper|websucker|WebTre|WebVac|webwalk|WebWasher|WebWeasel|WebWhacker|WebZIP|Wells|WEP\_S|WEP.Search.00|WeRelateBot|wget|Whack|Whacker|whiz|WhosTalking|Widow|Win67|window.location|Windows.95\;|Windows.95\)|Windows.98\;|Windows.98\)|Winodws|Wildsoft.Surfer|WinHT|winhttp|WinHttpRequest|WinHTTrack|Winnie.Poh|wire|WISEbot|wisenutbot|wish|Wizz|WordP|Works|world|WUMPUS|Wweb|WWWC|WWWOFFLE|WWW\-Collector|WWW.Mechanize|www.ranks.nl|wwwster|^x$|X12R1|x\-Tractor|Xaldon|Xenu|XGET|xirq|Y\!OASIS|Y\!Tunnel|yacy|YaDirectBot|Yahoo\-MMAudVid|YahooSeeker|YahooYSMcm|Yamm|Yand|yang|Yeti|Yoono|yori|Yotta|YTunnel|Zade|zagre|ZBot|Zeal|ZeBot|zerx|Zeus|ZIPCode|Zixy|zmao|Zyborg [NC]
RewriteRule ^(.*)$ - [F,L]
</IfModule>

Or block requests directly if `name` parameter includes your strings

RewriteCond %{QUERY_STRING} (^|&)name=(Not%20Recognized|No%20Subscription%20Detected)(&|$)
RewriteRule ^(.*) - [F]
11 minutes ago, modifiedcontent said:

Are the hackers using some kind of tools that inserts these for some reason?

11 minutes ago, modifiedcontent said:

No Subscription Detected

It looks like "hackers" are using a paid tool with expired/pirated/trial license :D

 

  • Like 2
  • Thanks 1
  • Haha 2

Share this post


Link to post
Share on other sites

One very easy and effective solution is to use honeypots. Ryan also uses this technique for Formbuilder and has (like me) very good results.

Just remember to turn off the autofill option for the input to prevent the browser from filling your hidden field and marking it as spam.

  • Like 3

Share this post


Link to post
Share on other sites

I have also written the login/logout system on my own (I needed UIKit Markup and some other customizations).

To prevent spam I use this Honeypot class and I have no problem since then. It make several tests before letting the user go further. I have installed it via composer so updating is also no problem.

So its a look worth while.

Best regards

  • Like 2

Share this post


Link to post
Share on other sites

Thanks bernhard and Juergen.

I have implemented a very basic version of a honeypot. It has so far cut the dumb "hack" attacks to zero. There are plenty of ways to make the honeypots more difficult to pass. Great approach. Happy I don't have to resort to captchas etc.

Turned autofill off as follows, also prevented tabbing to the hidden field:

<input name=some_name class=some_class value='' tabindex='-1' autocomplete=off>

Hidden via css; dozens of options to do that, make it harder for bots to figure out. Then in the process:

if($input->post->some_name) { ... foad ...}

I couldn't figure out Juergen's "Honeypot class" - still confused about composer, should I use it? - but see it also checks for minFormCompletionTime. Bots fill out forms inhumanly fast. That is another way to recognize them and block them.

Share this post


Link to post
Share on other sites

FYI, one site I rewrote recently the honeypot fails entirely. I wouldn't like to add a captcha so added sblam, whuch works fine so far:

https://sblam.com/en.html

  • Like 3

Share this post


Link to post
Share on other sites

Hello @modifiedcontent

Composer safes you a lot of time on updating and installing PHP-libraries which you want to use in your project. I use more than 1 external PHP library on my projects, so it makes really sense in my case. Honeypot class is only one of them.

If you have time you could read how to install it on your system. It seems to be difficult at the beginning, but there are also tutorial videos on Youtube that are really good and easy to follow. The only thing to mention: you have to work with the CLI (command line interface).

If you want to install for example the Honeypot class you only have to write

composer require dominiquevienne/honeypot

into your CLI and if you want to update it later you only have to write

composer update

Thats all and the latest version will be installed. No need to look for updates manually. No need to install updates manually. So its a really useful solution to install libraries and keep them up to date with less work. :)

  • Like 1

Share this post


Link to post
Share on other sites
17 hours ago, tpr said:

FYI, one site I rewrote recently the honeypot fails entirely. I wouldn't like to add a captcha so added sblam, whuch works fine so far:

https://sblam.com/en.html

Do you have more information why it failed and how exactly you did the setup (field names, time checks..)?

Share this post


Link to post
Share on other sites

Nothing special. It's named like hpt_pw_confirm, made hidden with inline style. It gas its own url too, /contact/, maybe that's why (previously it was an SPA site with no dedicated url).

Invisible captcha sounds great, I heard the term before but didn't know it works like that. The problem is that the form is a custom module and a captcha would require more time to add, but it seems I cannot skip that.

Share this post


Link to post
Share on other sites

I'm always using field names like password, email, name or the like. I guess most bots are more likely to fill fields with those names than any cryptic names.. would be interesting to try that in your case and see if that helps

  • Like 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By flydev 👊🏻
      Bootstrap-4 Minimal site profile for ProcessWire
      This profile is based on the "minimal site profile (intermediate edition)" and bundled with Boostrap v4.4.1
       
        Features
      Bootstrap SASS Font-Awesome SASS Render / helper functions for : Simple ul navigation Bootstrap Multi-level navbar Bootstrap Carousel Bootstrap Cards Bootstrap Jumbotron Boostrap Accordion Assets minification, files bundle   Dependencies
      jQuery Popper.js Bootstrap FontAwesome   Prequisites
       You'll want to install the following on your system before proceeding:
      Yarn / NPM How To Install
      Download the zip file at Github or clone directly the repo with git clone and skip the step 2. Extract the folder site-pwbs4-master into a fresh ProcessWire installation root folder. During the installation of ProcessWire, choose the profile "ProcessWire Bootstrap 4 profile".   After installation
      You can find the development file (CSS/SCSS/JS) in site/assets/dev/src
      The profile can be used as is only with $config->debug set to false. To use it in debug mode, you are required to install the dependencies with the package manager.
      Open a terminal in site/assets/dev and execute the following command-line: yarn Available commands :
      Rebuild, minify and bundle assets for release : yarn build   References
      Bootstrap v4 documentation ProcessWire documentation ProcessWire Forum: bootstrap tag ProcessWire Forum: bootstrap related posts   Credits
      The ProcessWire staff Inspiration from @gebeer and his Bootstrap 3 profile post Members who contributed in various post about Bootstrap navigation and code (see code-source for refs). Screenshots

    • By franciccio-ITALIANO
      Hi, I need to provide a quite complex user registration form: description, subdescription, drop-down lists etc. 
      Through this registration, users will be able to access and comment.
      If someone responds to their comments, I would like a NOTIFICATION to appear when accessing their panel.
      My social interaction project is just that, it seems simple, I don't need more.
      Now I am undecided whether to use buddypress, elgg, or a native processwire system.
      What do you recommend? 
      If you recommend processwire, which modules should I install?
      Do they work or is processwire too immature for that?
      Translated with www.DeepL.com/Translator (free version)
    • By abdulqayyum
      Dear processwire community,
      i have a problem in loginRegister module, i could not add custom field in login and register page.
      i read from plugin documentation. they are saying.
      " By default, the email and password fields are required for both forms. You may want to add more fields. To do this, you’ll need to add fields to your “user” template. You can add fields to your user template in the admin by going to “Setup > Templates > Show system templates > user”.

      but i could not find similar scenario like “Setup > Templates > Show system templates > user”
      i can see just "Setup > Templates" not seeing "Show system templates > user" in my admin panel.

      Please help me in this case that how i can add custom field in these two page.
      Regards AbdulQayyum

    • By rafaoski
      This profile can be used as a business card or very simple blog.
      Requires the latest version processwire 3.0.101 !!!
      Milligram Site Profile For Processwire 3x with include functions like:
      MarkupRegions
      FunctionsAPI
      wireIncludeFile | wireRenderFile
      Essentially, this structure uses minimalist CSS framework Milligram and the Flexbox Grid System Gridlex
       
      Live Example
      CAN DOWNLOAD FROM THIS LINK ( Basic Version and simple Blog Version )
      https://github.com/rafaoski/site-milligram
      https://github.com/rafaoski/site-milligram-blog
      Screenshot:

      If you want to use Laravel Mix you must first ensure that Node.js and NPM are installed on your machine.
      Basic example to Debian and Ubuntu based Linux distributions:
      Node.js
      curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash - sudo apt-get install -y nodejs
      See more installation options LINK
      npm is installed with Node.js just check in linux terminal like below:
      node -v
      npm -v
      Set BrowserSync inside folder /templates/webpack.mix.js and change your dev url
      proxy: 'http://localhost/mix/', to your installation processwire folder like:
      proxy: 'http://localhost/your-processwire-installation-folder/',
      Next install npm packages in your templates folder with command npm install
      Now, boot up the dev server npm run watch, and you're all set go!
      On completion, use the command npm run production to build styles and scripts in the dist folder
      Simple Usage ( Basic Command )
      Run npm install Watch npm run watch Build npm run production All files to Webpack build steps is inside file ( webpack.mix.js )
      Folder With all SCSS files is inside templates/src/scss
      All build styles and scripts is inside the ( dist ) folder
      References:
      Milligram
      Gridlex
      Laravel Mix
      Feather Icons
      Web Font Loader
      Verlok Lazy Load
      Cookie Consent
      Particles.js
       
       
       
       
×
×
  • Create New...