I'm react developer for 2 months. My aim is to build my own website like GitHub for this of course I need some kind of IDE like VS code where I can upload my code. I recently learned about VS Code Intellisense but I did not find some helpful content. I don't how it works but what I learned is, VS Code keeps track of changes in the file intelligent code completion uses an automatically generated in-memory database of classes, variable names, and other constructs that give computer code defines or references. As I mentioned earlier I want to build my own IDE like VS Code i end up with a simple approach but it's not efficient. Please have a look at my approach and then suggest me better approach.
// list of some keyword
const listOfKeyWords = {
'var' , 'const' , 'let' , 'for' , 'if' , 'else' // ...
}
const [ code , SetCode ] = useState('') // grabs value from DOM input tag
const [ filterCodeState , SetFilterCodeState ] = useState('')
// Filter Code
function FilterCode ( ) {
let filterCode = ''
var stack = new Stack
code.forEach ( (word , idx) => {
if(word === ' '){
let str = ''
while(!stack.empty())
str.push (stack.top())
if(listOfKeyWords.indexOf(str) != -1) // string is keyWord add color to it
filterCode += `<p className = 'text-info'>${str}</p>`
else filterCode += str
}
stack.push(word)
SetFilterCode(SetFilterCode)
})
}
return ( <>
{ SetFilterCodeState }
</>
)
I know there are lots to do but this is simple code. of course, it will take too much performance cost. How I can make something like this and also manage performance.
Please answer the following questions :
-
Is there any plug-in I can use directly?
-
How color of ide work is they change color using HTML and CSS?
-
How I can manage the database for this?
from how to achive Visual Code intellisense in web application
No comments:
Post a Comment