Develop Reference

Is react easy to integrate with already-created html and css files

I'm working with some developers to create a website, and I want to know if React will work if I hire someone to create the html and css first, and then have another person integrate react with those templates
Is react integratable in this situation, or does react have to be used from the get go? I am a python programmer, so I have no clue how react works lol

The main advantage of React is being able to generate HTML based on JavaScript code, if the HTML code is already done I'd find it kind of pointless to use React.
I am just a 2nd year student but I'd recommend to use React from the get go.

It should technically be possible to integrate react with already existing html/css files, just like you can manually alter the html and css files in your react project’s public folder, but you dont really provide a good reason for doing so. It might be easier, and more sustainable for maintaining the project to simply move your existing Html into a react project. If you dont have an actual good reason to use react for this project (like for example having primarily react-experienced developers on the team or needing to use specific react libraries and functionalities), there is no real harm in developing a website with plain html, css, and js.

CreateReactApp: embed end-user plugin at runtime

We have a React application created/deployed using CreateReactApp.
This application is able to display some widgets. We've predefined types of widgets deployed with our own application. We'd like the end-users of our application to be able to develop their own type of widgets - using a dev tool like Webstorm/VisualStudio - and deploy them into our application.
Our application needs to provide a public API and a plugin dev library
We want the plugins to be able to use the libraries our application is using (e.g. React, material-ui…)
We need a way to "load" end-user code that is registering new widget types using our public API.
Can we do that using CreateReactApp or do we need to eject?
What are the best practices for doing this?

I have more a suggestion than an answer, a best practice for that can depend on the structure of your current project, so I don't think there's a right answer. I wrote a small proof-of-concept, feel free to fork and use that, if it helps: https://github.com/anderick/react-dynamic-components.
Our application needs to provide a public API and a plugin dev library
To solve this you can create a folder structure to let users upload their component projects.
You need a name or id to link this new uploaded project so you can load it later.
We want the plugins to be able to use the libraries our application is using (e.g. React, material-ui…)
If the use is only allowed to use the libraries you already have, you don't need to worry about their package.json.
In case you want to allow users to use their own libs, it adds some complexity on how to process this during runtime.
We need a way to "load" end-user code that is registering new widget types using our public API.
You can use create-react-app in this approach, but you may need a good definition of an entry point (in my example project, I'm using Index.js as the file I'll use as the main component of the project), or some kind of descriptor(maybe extending package.json) so you can read from your application to understand how to load the component. I'd go with the first approach, convention over configuration is more simple, and you can expand from that with a descriptor later.

by ejecting you can customize anything you want but you've to configure and maintain it by yourself, I think going through CreateReactApp also a good idea based on your criteria. I hope this article may help you out.
Thank You!
MSS-

Guide for extending the Javascript language on VsCode for a 3rd party API

So I've started using VsCode over Atom recently and love it, the issue is I develop for software that uses its own JS API with no proper integration into anything.
I've started trying to implement my own autocomplete/intellisense structure using their pdf into VsCode to speed up my workflow, currently I'm simply using a JS file that is full of empty functions and objects with a bunch of JSDoc comments to help VsCode Intellisense identify what's what, that seems to be working fine so far but it means importing this "useless" file into every project I work on.
I looked into extending the JS language using a language server but that seems way too complex for what I need (plus it looks like I'd be building the entire Javascript language from scratch).
Does anyone have any recommendations ect?
Kind regards.
Edit
Sorry I also would like the ability for it to pass linting as right now it gets a bit funky with it.

You likely do not need an extension for that your example use case.
VS Code's intellisense for libraries is powered by .d.ts typing declaration files. The declaration files for the library you are using can either be written in your current workspace as you are currently doing, or—preferably—shipped with the library itself. Many npm modules ship their with typing definitions files, while other libraries have typing definition files provided by the community through DefinitelyTyped.
You alternatively bundle d.ts types file into as a separate npm package that you include in any project that needs them

Adding watermark.js to angular 4

Hi I am trying to add watermark to the image and i am trying to include watermark.js to the angular 4. Could someone please tell me how to include watermark.js in angular. I tried installing using
npm install watermark -save
and then using the
import * as watermark from 'watermark';
but the above line throws me an error stating cannot find module 'watermark'
can someone please tell how i can import the watermark.js and use it to watermark my image?

You're missing type definitions for watermark.js. However, judging by this github issue, the authors of this lib currently don't offer them.
You have a couple of possibilities to fix this:
Declare type definition manually. This is the quickest way, but you'll also lose all type safety when it comes to using this lib
Help with creating proper type definitions (as shown in this tutorial). This way you'll be type safe, learn a lot about the TS type system, and, as a bonus, contribute back to the OSS community.
Good luck!

import external js file in meteor project

I have a meteor project where I want to include the conversational form framework.
There is a npm package, however it is not properly imported (probably due to some kind of bug). According to the github issue, this:
import cf from 'conversational-form'
does not work, because the export function exports cf.ConversationalForm, not cf (but cf is needed for existing declarations). The form is created and styled, but cannot be addressed in the js.
I was already able to use the framework in a normal html/js/css project, so now I wanted to just include the external script as a workaround.
However, downloading + importing in client/main.js did not work for me.
I've tried:
import '/imports/api/conversational-form.min.js
as well as:
$.getScript
in Meteor.startup.
Do I need to write specific exports in the external .js? I'm far from a professional, so I'm a little hesitant to dissect the external .js.
Any tips on how to simply mimic the html-script-inclusion? Or other ideas on how to get the framework running?
Sincerely, desperate.

Well Meteor allows you many ways to do that, the first ideas that come to my mind are:
Depending on your project structure you can create your own meteor package as a wrapper and internally load the library.
Hardcoding the script tag in you entry point.(Im not sure if this would work to be honest but you can try).

I ended up downloading the script, modifying it to set my options and including it via \imports.
VERY hacky solution, but well, it works...

Meteor allow you to load external library and scope them in all the client
via the /compatibility folder.
Just put the file in there, and it will be scoped automaticaly.